@charset "utf-8";
/* CSS Document */
/* タブレット */
@media screen and (min-width:600px) and (max-width:1179px) {
	#head {
 	background:url("../../images/200314/tablet/bg_header@2x.jpg") center top no-repeat;
	width: 100%;
 	height: 0;
	padding-top:calc(932 / 1536 * 100%);
	background-size: contain;
 	font-size: 0em;
 	}
	#head_pre {
 	background:url("../../images/200314/tablet/bg_header_pre.jpg") center top no-repeat;
	width: 100%;
 	height: 0;
	padding-top:calc(922 / 1536 * 100%);
	background-size: contain;
 	font-size: 0em;
 	}
	#head h1, #head h2, #head_pre h1, #head_pre h2 {
	font-size: 0em;
	}
	#gnav {
	width: 94%;
	margin: 0 auto;
	margin-bottom: 3%;
	}
	#btn_archive a {
	display: block;
	background: url(https://cdn.tv-osaka.co.jp/cdn/v1.0/sp/osaka_lover/images/180526/desktop/btn_archive.png) no-repeat;
	width: 49%;
	height: 0;
	padding-top:calc(205 / 640 * 50%); 
	background-size: contain;
 	font-size: 0em;
	float: left;
	}
	#btn_kanran {
	display: block;
	background: url(https://cdn.tv-osaka.co.jp/cdn/v1.0/sp/osaka_lover/images/180421/desktop/btn_kanran.png) no-repeat;
	width: 49%;
	height: 0;
	padding-top:calc(196 / 640 * 50%); 
	background-size: contain;
 	font-size: 0em;
	margin: 0.5% 0 0 2%;
	float: left;
	}
	#btn_kanran_on a {
	display: block;
	background: url(https://cdn.tv-osaka.co.jp/cdn/v1.0/sp/osaka_lover/images/180526/desktop/btn_kanran.png) no-repeat;
	width: 49%;
	height: 0;
	padding-top:calc(196 / 640 * 50%); 
	background-size: contain;
 	font-size: 0em;
	margin: 0 0 0 2%;
	float: left;
	}
	#movie {
	display: block;
	position: relative;
	width: 60%;
	padding-top:calc(9 / 16 * 60%);
	margin: 3% auto;
	background-size: contain;
	clear: both;
	}
	#movie .tvo-video {
	position: absolute;
	width: 100%;
	height: 100%;
	top:0 ;
	right: 0;
	margin-top: 3%;
	}
	
	main {
	font: 100%/1.4 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
	/*font-family: 'Noto Sans JP', sans-serif;*/
	font-family: 'Noto Serif JP', serif;
	width:100%;
	margin: 0 auto;
	}	
	#about p, #about_pre {
	width: 92%;
	margin: 0 auto;
	color: #553400;
	font-size: 1em;
	line-height: 175%;
	margin: 2% auto;
	text-align: center;
	}
	
	/***出演者***/
	#cast {
	background: url("../../images/200314/tablet/bg_cast@2x.png") no-repeat;
	width: calc(1460 / 1536 * 100%);
 	height: 0;
	padding-top:calc(913 / 1536 * 100%);
	background-size: contain;
 	font-size: 0em;
	margin: 5% auto;
	}
	#cast_pre {
	background: url("../../images/200314/tablet/bg_cast_pre.png") no-repeat;
	width: calc(1460 / 1536 * 100%);
 	height: 0;
	padding-top:calc(913 / 1536 * 100%);
	background-size: contain;
 	font-size: 0em;
	margin: 5% auto;
	}
	.txt  {
	width: 93.75%;
	font-size: 1.0em;
	line-height: 175%;
	color: #fff;
	margin: 0 auto;
	padding-top: 2%;
	}
	/***ページ内メニュー***/
	#menu {
	width: calc(1460 / 1536 * 100%);
 	height: 0;
	padding-top:calc(913 / 1536 * 100%);
	background-size: contain;
 	font-size: 0em;
	margin: 0 auto;
	margin-top: -27.5%;
	margin-bottom: 5%;
	}
	#btn_pon {
	display: block;
	position: relative;
	width: calc(335 / 1180 * 100%);
	height: 0;
	padding-top: calc(335 / 1180 * 100%);
	background-size: contain;
	margin-top: -50%;
	float: left;
	}
	#btn_douyama {
	display: block;
	position: relative;
	width: calc(335 / 1180 * 100%);
	height: 0;
	padding-top: calc(335 / 1180 * 100%);
	background-size: contain;
	margin: -50% 0 0 71%;
	float: left;
	}
	#btn_hamadera {
	display: block;
	position: relative;
	width: calc(335/ 1180 * 100%);
	height: 0;
	padding-top: calc(335 / 1180 * 100%);
	background-size: contain;
	margin: -29% 0 0 21%;
	float: left;
	}
	#btn_bus{
	background: url("../../images/200314/common/btn_bus01.png") no-repeat;
	display: block;
	position: relative;
	width: calc(335/ 1180 * 100%);
	height: 0;
	padding-top: calc(335 / 1180 * 100%);
	background-size: contain;
	margin: -29% 0 0 50.5%;
	float: left;
	}
	/*--- アニメーション用 ---*/
	.hamadera li {
	opacity: 0;
	animation: btn_anim 12s linear infinite 0s;
	width: 100%;
	height: 0;
	padding-top:100%;
	background-size: contain;
	float: left;
	}
	.hamadera li:nth-child(1) {
	background: url(../../images/200314/common/btn_hamadera01.png) no-repeat;
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	}
	.hamadera li:nth-child(2) {
	background: url(../../images/200314/common/btn_hamadera04.png) no-repeat; 
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	animation-delay: 3s;
	}
	.hamadera li:nth-child(3) {
	background: url(../../images/200314/common/btn_hamadera02.png) no-repeat; 
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	animation-delay: 6s;
	}
	.hamadera li:nth-child(4) {
	background: url(../../images/200314/common/btn_hamadera03.png) no-repeat; 
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	animation-delay: 9s;
	}
	
	.douyama li {
	opacity: 0;
	animation: btn_anim 12s linear infinite 0s;
	width: 100%;
	height: 0;
	padding-top:100%;
	background-size: contain;
	float: left;
	}
	.douyama li:nth-child(1) {
	background: url(../../images/200314/common/btn_douyama01.png) no-repeat;
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	}
	.douyama li:nth-child(2) {
	background: url(../../images/200314/common/btn_douyama04.png) no-repeat; 
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	animation-delay: 3s;
	}
	.douyama li:nth-child(3) {
	background: url(../../images/200314/common/btn_douyama02.png) no-repeat; 
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	animation-delay: 6s;
	}
	.douyama li:nth-child(4) {
	background: url(../../images/200314/common/btn_douyama03.png) no-repeat; 
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	animation-delay: 9s;
	}
	
	.pon li {
	opacity: 0;
	animation: btn_anim 12s linear infinite 0s;
	width: 100%;
	height: 0;
	padding-top:100%;
	background-size: contain;
	float: left;
	}
	.pon li:nth-child(1) {
	background: url(../../images/200314/common/btn_pon01.png) no-repeat;
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	}
	.pon li:nth-child(2) {
	background: url(../../images/200314/common/btn_pon04.png) no-repeat; 
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	animation-delay: 3s;
	}
	.pon li:nth-child(3) {
	background: url(../../images/200314/common/btn_pon02.png) no-repeat; 
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	animation-delay: 6s;
	}
	.pon li:nth-child(4) {
	background: url(../../images/200314/common/btn_pon03.png) no-repeat; 
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	animation-delay: 9s;
	}
	
	.bus li {
	opacity: 0;
	animation: btn_anim 12s linear infinite 0s;
	width: 100%;
	height: 0;
	padding-top:100%;
	background-size: contain;
	float: left;
	}
	.bus li:nth-child(1) {
	background: url(../../images/200314/common/btn_bus01.png) no-repeat;
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	}
	.bus li:nth-child(2) {
	background: url(../../images/200314/common/btn_bus04.png) no-repeat; 
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	animation-delay: 3s;
	}
	.bus li:nth-child(3) {
	background: url(../../images/200314/common/btn_bus02.png) no-repeat; 
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	animation-delay: 6s;
	}
	.bus li:nth-child(4) {
	background: url(../../images/200314/common/btn_bus03.png) no-repeat; 
	height: 0;
	padding-top:100%;
	background-size: contain;
	margin-top: -100%;
	animation-delay: 9s;
	}
	
	@keyframes btn_anim {
	0% { opacity: 0; }
    5% { opacity: 1; }
    25% { opacity: 1; }
    50% { opacity: 0; }
    100% { opacity: 0; } 
	}
	
	/***コンテンツ内共通***/
	#cont_pon, #cont_douyama, #cont_hamadera, #cont_bus  {
	padding: 1% 0;
	text-align: center;
	}
	#cont_pon li, #cont_douyama li, #cont_hamadera li, #cont_bus li {
	margin: 1px;
	}
	#cont_pon li span, #cont_douyama li span, #cont_hamadera li span, #cont_bus li span {
	display: block;
	background-color:rgba(0,0,0,0.5);
	font-size: 0.9rem;
	line-height: 200%;
	color: #fff;
	}
	
	/****北極****/
	#cont_pon h1 {
	background: url("../../images/200314/tablet/ttl_pon@2x.jpg") center no-repeat;
	width: calc(1536/ 1536 * 100%);
	height: 0;
	padding-top: calc(400/ 1536 * 100%);
	background-size: contain;
	margin: 0 auto;
	font-size: 0em;
	}
	#cont_pon h2 {font-size: 0em;}
	#cont_pon dt {
	background: url("../../images/200314/tablet/pon01@2x.jpg") center top no-repeat;
	width: 100%;
	height: 0;
	padding-bottom: calc(1036/ 1536 * 100%);
	background-size: contain;
	}
	#cont_pon dd:nth-child(2) {
	width: 94%;
	margin: 1rem auto;
	font-size: 1rem;
	line-height: 175%;
	text-align: left;
	}
	#cont_pon dd:nth-child(3),  #cont_pon dd:nth-child(4){display: none;}
	#cont_pon dd:nth-child(5) {
	width: 94%;
	margin: 1rem auto;
	font-size: 1rem;
	line-height: 175%;
	text-align: left;
	}
	
	/****第1ビル****/
	#cont_douyama h1 {
	background: url("../../images/200314/tablet/ttl_douyama@2x.jpg") center no-repeat;
	width: calc(1536 / 1536 * 100%);
	height: 0;
	padding-top: calc(400/ 1536 * 100%);
	background-size: contain;
	margin: 0 auto;
	font-size: 0em;
	}
	#cont_douyama h2{ font-size: 0em;}
	#cont_douyama dt {
	background: url("../../images/200314/tablet/douyama01@2x.jpg") center top no-repeat;
	width: 100%;
	height: 0;
	padding-top: calc(1080/ 1536 * 100%);
	background-size: contain
	}
	#cont_douyama dd:nth-child(2) {
	width: 94%;
	margin: 1rem auto;
	font-size: 1rem;
	line-height: 175%;
	text-align: left;
	}
	#cont_douyama dd:nth-child(3) { display: none;}
	#cont_douyama dd:nth-child(4) {
	width: 94%;
	margin: 1rem auto;
	font-size: 1rem;
	line-height: 175%;
	text-align: left;
	}
	#cont_douyama dd:nth-child(5) {
	background: url("../../images/200314/tablet/douyama02@2x.jpg") center top no-repeat;
	width: 100%;
	height: 0;
	padding-bottom: calc(1082/ 1536 * 100%);
	background-size: contain;
	float: left;
	}

	/***真法院町***/
	#cont_hamadera h1 {
	background: url("../../images/200314/tablet/ttl_hamadera@2x.jpg") center top no-repeat;
	width: calc(1536 / 1536 * 100%);
	height: 0;
	padding-top: calc(400 / 1536 * 100%);
	background-size: contain;
	margin: 0 auto;
	font-size: 0em;
	}
	#cont_hamadera h2 {font-size: 0em;}
	#cont_hamadera dt {
	background: url(../../images/200314/tablet/hamadera01@2x.jpg) center top no-repeat;
	width: 100%;
	height: 0;
	padding-top: calc(1080/ 1536 * 100%);
	background-size: contain;
	}
	#cont_hamadera dd:nth-child(2) {
	width: 94%;
	margin: 1rem auto;
	font-size: 1rem;
	line-height: 175%;
	text-align: left;
	}
	#cont_hamadera dd:nth-child(3) {display: none;}
	#cont_hamadera dd:nth-child(4) {
	width: 94%;
	margin: 1rem auto;
	font-size: 1rem;
	line-height: 175%;
	text-align: left;
	}
	
	/****市バス****/
	#cont_bus h1 {
	background: url("../../images/200314/tablet/ttl_bus@2x.jpg") center no-repeat;
	width: calc(1536 / 1536 * 100%);
	height: 0;
	padding-top: calc(400 / 1536 * 100%);
	background-size: contain;
	margin: 0 auto;
	margin-bottom: 2%;
	font-size: 0em;
	}
	#cont_bus h2 {font-size: 0em;}
	#cont_bus dt {
	background: url("../../images/200314/tablet/bus01@2x.jpg") center top no-repeat;
	width: 100%;
	height: 0;
	padding-top: calc(1080 / 1536 * 100%);
	background-size: contain;
	margin-bottom: 2%;
	}
	#cont_bus dd:nth-child(2) {
	width: 94%;
	margin: 1rem auto;
	font-size: 1rem;
	line-height: 175%;
	text-align: left;
	}
	#cont_bus dd:nth-child(3), #cont_bus dd:nth-child(4) {display: none;}
	#cont_bus dd:nth-child(6) {
	background: url("../../images/200314/tablet/bus02@2x.jpg") center top no-repeat;
	width:100%;
	height: 0;
	padding-bottom: calc(1080/ 1536 * 100%);
	background-size: contain;
	}
	#cont_bus dd:nth-child(5) {
	width: 94%;
	margin: 1rem auto;
	font-size: 1rem;
	line-height: 175%;
	text-align: left;
	}
	
	/***写真***
	#cont_pon ul, #cont_relocate ul, #cont_douyama ul, #cont_hamadera ul  {
	width: 100%;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	}
	.cont li {
	width: 49%;
	margin: 5% 0 20px 0;
	}
	.cont li img {
	width: 100%;
	}
	.cont  li span {
	width: 10%;
	height: auto;
	margin: 0 auto;
	padding: 3% 0;
	font-size: 0.9rem;
	display: table-cell;
    vertical-align: top;
	text-align: center;
	color: #fff;
	}*/
	.cont p {
	clear: both;
	width: 96%;
	padding: 25px 0;
	font-size: 1.2rem;
	color: #fff;
	}
	
	#notice {
	width: 90%;
	margin: 5% auto;
	padding: 5% ;
	font-size: 1em;
	line-height: 175%;
	border: #000 1px solid;
	}
	.onlysmp {display: none;}

div#tw {
	width: 80%;
	height: 515px;
	margin:  5% auto;
	}
	
	.tver {margin: 3%;}
	.tvers {
	width:100%;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin: 3% auto;
	text-align: center;
	}
	.tvers a {
	width: 45%;
	border: #666666 1px dotted;
	margin: 2%;
	text-decoration: none;
	line-height: 175%;
	}
	.tvers a:hover { opacity: 0.7;}
}