﻿@charset "UTF-8";

/* ▼▼▼ ミオホール トップ
=====================================*/
/* 共通 */
section{
    max-width: 1000px;
    margin: 0 auto;
	padding: 50px 20px;
    }
.main_img{
    max-width: 1000px;
    margin: 0 auto;
	padding: 50px 20px 0;
	}
	.main_img img{
		width: 100%;
		}
.accordion_area{
	overflow: hidden;
	}

ul.line > li{
	border-bottom: 1px dotted #ccc;
	margin: 0 0 30px;
	padding: 0 0 30px;
	}
ul.line > li:last-of-type{
	border:none;
	margin:0;
	padding:0;
	}
h1.miohall_h1{
	margin-bottom:30px;
	font-size:28px;
	font-weight: bold;
	text-align: center;
	}

h4.open_sp{
	background: #FAF7F7;
	border: 1px solid #ccc;
	padding: 15px;
	padding-left: 30px;
	}
.accordion_inner{
	margin: 0 0 40px;
	}

table.fixtures_list{
	border-left: 1px solid #ccc;
	width: 100%;
	margin: 0 0 40px;
	}
	table.fixtures_list th,
	table.fixtures_list td {
		border-bottom: 1px solid #ccc;
		border-right: 1px solid #ccc;
		padding: 15px;
		padding-left: 30px;
		font-weight: normal;
		vertical-align: middle;
		}
	table.fixtures_list th:first-child,
	table.fixtures_list td:first-child{
		width: 70%;
		}
	table.fixtures_list th:last-of-type,
	table.fixtures_list td:last-of-type{
		text-align: center;
		}

	table.fixtures_list th{
		background: #F5F5F5;
		}
table.price_list{
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	width: 100%;
	margin: 0 0 40px;
	}
	table.price_list tr th,
	table.price_list tr td{
		border-bottom: 1px solid #ccc;
		border-right: 1px solid #ccc;
		height: 55px;
		font-weight: normal;
		text-align: center;
		vertical-align: middle;
		}
	table.price_list tr th{
		background: #F5F5F5;
		}
#scroll {
	margin: 40px auto 0;
	}
	#scroll table.price_list tr th:nth-child(-n + 2){
		width: 150px;
		}
.more_btn {
	margin: 40px auto 0;
	}
ul.line > li li{
	text-indent: -1em;
    padding-left: 1em;
	}
	ul.line > li li:before{
		content: "・";
		}

table.info_list{
	border: 1px solid #ccc;
	border-bottom: 0 none;
	width: 100%;
	}
	table.info_list tr th,
	table.info_list tr td{
		border-bottom: 1px solid #ccc;
	    padding: 15px 0;
	    }
	table.info_list tr th{
		background: #F7F7F7;
		border-right: 1px solid #ccc;
		width: 50%;
		padding-left: 5%;
		font-weight: normal;
		vertical-align: middle;
		}
	table.info_list tr td{
		padding-left: 5%;
		}

#contact .contact_detail{
	margin: 0 0 30px;
	}

/* 201911 リニューアル時の追加css */

/* スライド共通 */
.slick-list,
.slick-track,
.slick-slide,
.slick-slide > div{
	height: 100%!important;
	}

/* メインビジュアルスライド */
.main_slider_wrap{
	margin:auto;
	text-align: center;
	position: relative;
	}
.main_slider_wrap .main_slider{
	max-width:750px;
	height:750px;
	margin:auto;
	}
.main_slider_wrap .slick-slide > div li{
	height: 100%!important;
	}
.main_slider_wrap .main_slider li img{
	margin:auto;
	}
.main_slider_wrap .white_block{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	width:400px;
	height:400px;
	background: rgba(255,255,255,0.85);
	margin:auto;
	position: absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	z-index: 1000;
	}
.main_slider_wrap .white_block p{
	font-size:40px;
	text-align: center;
	line-height: 1;
	}
.main_slider_wrap .white_block p span{
	font-size:18px;
	}




.wrap_bg_yellow{
	background: #FDFAF2;
	padding-bottom:50px;
	}
.wrap_bg_yellow section p{
	text-align: center;
	}
.wrap_bg_yellow section p:first-of-type{
	font-size:20px;
	}
.wrap_bg_yellow section p:nth-of-type(2){
	margin:10px auto 30px;
	color:#A25E5E;
	font-size:30px;
	font-weight: bold;
	line-height: 1.2;
	}
.wrap_bg_yellow section p:nth-of-type(3){
	font-size:16px;
	}

/* 内観スライド */
.photo_slider{
	max-width: 750px;
	max-height:460px;
	margin:20px auto;
	}
.photo_slider .slick-list {
    overflow: visible !important;
	}
.photo_slider .prev_arrow{
	width: 40px;
    height: 40px;
    background: #000;
    margin: auto;
    position: absolute;
    top: 0;
    left: -5px;
    bottom: 0;
    z-index: 1000;
	cursor: pointer;
	}
.photo_slider .prev_arrow::after{
	content:'';
	display: block;
    width: 9px;
    height: 9px;
    background: none;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
	position: absolute;
    top: 0;
    bottom: 0;
    left: 17px;
    margin: auto;
	}
.photo_slider .next_arrow{
	width: 40px;
    height: 40px;
    background: #000;
    margin: auto;
    position: absolute;
    top: 0;
    right: -5px;
    bottom: 0;
    z-index: 1000;
	cursor: pointer;
	}
.photo_slider .next_arrow::after{
	content:'';
	display: block;
    width: 9px;
    height: 9px;
    background: none;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
	position: absolute;
    top: 0;
    bottom: 0;
    right: 17px;
    margin: auto;
	}
.photo_slider li{
    width: auto!important;
    max-height: 460px;
	margin:0 15px;
	position: relative;
	}
.photo_slider li img{
	width:100%;
	height:100%;
	margin:auto;
	}
.photo_slider li p{
	background: #FAF7F7;
	padding:5px;
	font-size:16px;
	position: absolute;
	bottom:0;
	left:0;
	}
.slick-box {
	margin: 0;
	padding: 0;
	line-height: 0;
	}
/* dotsカスタム */
.photo_slide_dots {
	text-align: center;
	}
.photo_slide_dots li{
		display: inline-block;
		margin: 0 15px;
		}
	.photo_slide_dots li button{
		background: none;
		border: none;
		position: relative;
		text-indent: -9999px;
		outline:none;
		}
	.photo_slide_dots li button::before{
		content: '';
		width: 8px;
		height:8px;
		border: 1px solid #4A4949;
		border-radius:50%;
		text-indent: 0px;
		position: absolute;
		top: 0;
		left: 0;
		transition: 0.2s;
		cursor: pointer;
		}
	.photo_slide_dots li.slick-active button::before{
		background: #4A4949;
		}


.wrap_bg_yellow .container span {
	font-weight: bold;
	}


.wrap_bg_pink{
	background:#FAF7F7;
	}

/* ページ内リンクナビ */
ul.hall_sub_navi{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	height:80px;
	padding: 15px 0;
	}
ul.hall_sub_navi li{
	flex: 1 0 auto;
	height: 100%;
	border-left:1px dotted #999;
	}
ul.hall_sub_navi li:last-of-type{
	border-right:1px dotted #999;
	}
ul.hall_sub_navi li a{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	width:100%;
	height:100%;
	padding: 5px 0 0 0;
	text-align: center;
	position: relative;
	}
ul.hall_sub_navi li a::after{
	content: '';
    width: 8px;
    height: 8px;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    position: absolute;
    right: 0;
    bottom: 6px;
    left: 0;
    margin: auto;
    -webkit-transform: rotate(45deg);
    transform: rotate(135deg);
	}

/* イベント事例 */
.event_slider{
	margin:auto;
	}
.event_slider.slick-slider{
	width: 360px;
	}
.event_slider .slick-slide{
	margin:0 8px;
	}
.event_slider .slick-list {
    overflow: visible !important;
	}
.event_slider li{
	height: 0;
    padding-bottom: 100%;
	position: relative;
	}
.event_slider li:hover{
	opacity: 0.6;
	}
.event_slider li a{
	padding-bottom: 100%;
	}
.event_slider li a:hover{
	opacity: 1!important;
	}
.event_slider li img{
	width:100%;
	height:100%;
	margin:auto;
	}
.event_slider li span{
	display: block;
	background: #FAF7F7;
	padding:5px;
	font-size:16px;
	position: absolute;
	bottom:0;
	left:0;
	}
.slick-box {
	margin: 0;
	padding: 0;
	line-height: 0;
	}

.event_slider .prev_arrow{
	width: 40px;
    height: 40px;
    background: #000;
    margin: auto;
    position: absolute;
    top: 0;
    left: -106%;
    bottom: 0;
    z-index: 1000;
	cursor: pointer;
	}
.event_slider .prev_arrow::after{
	content:'';
	display: block;
    width: 9px;
    height: 9px;
    background: none;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
	position: absolute;
    top: 0;
    bottom: 0;
    left: 17px;
    margin: auto;
	}
.event_slider .next_arrow{
	width: 40px;
    height: 40px;
    background: #000;
    margin: auto;
    position: absolute;
    top: 0;
    right: -106%;
    bottom: 0;
    z-index: 1000;
	cursor: pointer;
	}
.event_slider .next_arrow::after{
	content:'';
	display: block;
    width: 9px;
    height: 9px;
    background: none;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
	position: absolute;
    top: 0;
    bottom: 0;
    right: 17px;
    margin: auto;
	}




/* ミオホールの概要 */
#overview h1.miohall_h1{
	margin-bottom:0;
	}
.floor_plan{
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	margin-top:30px;
	}
.map_img{
	margin-right:20px;
	width: 52%;
	}
.table_wrap{
	width:45%;
	}
table.hall_area{
	border-top: 1px solid #707070;
	border-left: 1px solid #707070;
	width: 100%;
	}
	table.hall_area tr th,
	table.hall_area tr td{
		border-right: 1px solid #707070;
		border-bottom: 1px solid #707070;
		padding: 6px 20px;
		font-size:10px;
		font-weight: normal;
		text-align: center;
		white-space: nowrap;
		vertical-align: middle;
		}
	table.hall_area tr th span,
	table.hall_area tr td span{
		font-size:14px;
		}
	table.hall_area tr th{
		background: #F8F6EB;
		width: 35%;
		}
	table.hall_area tr th:nth-of-type(2),
	table.hall_area tr td:first-of-type{
		color:#F48480;
		}
	table.hall_area tr th:nth-of-type(3),
	table.hall_area tr td:nth-of-type(2){
		color:#489C91;
		}
	table.hall_area tr td{
		width: 15%;
		background: #fff;
		}
#overview section > p{
	text-align: center;
	}
#overview .table_wrap p.overview_notice{
	margin:15px 0 0 0;
	font-size:12px;
	}

/* 詳細 */
#detail{
	padding-bottom:40px;
	}
.wrap_bg_beige{
	background: #EDE8DF;
	}
.wrap_bg_beige h1.miohall_h1{
	text-align: left;
	}
.detail_notice{
	margin-bottom:20px;
	}

/* ▼▼▼ ミオホール イベントアーカイブ
=====================================*/
.archive_wrap{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	}
.archive_wrap div{
	width:32%;
	margin-bottom:2%;
	}
.archive_wrap .archive_btn a{
	display: block;
	padding-bottom:100%;
	}





/* イベント事例詳細 */
.inner_box{
	padding: 15px 0 0 15px;
	}




.event_detail_photo {
    width: calc(100% - 15px);
    margin: 0 auto 0 0;
    font-size: 0;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
	}
.event_detail_photo .slick-list{
	width: 100%;
	}
.event_detail_photo .slick-list,
.event_detail_photo .slick-track,
.event_detail_photo .slick-slide,
.event_detail_photo .slick-slide > div,
.event_detail_photo .main_slider_wrap .slick-slide > div li {
    text-align: center;
	}
.event_detail_photo .prev_arrow{
	width: 40px;
    height: 40px;
    background: #000;
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 1000;
	cursor: pointer;
	}
.event_detail_photo .prev_arrow::after{
	content:'';
	display: block;
    width: 9px;
    height: 9px;
    background: none;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
	position: absolute;
    top: 0;
    bottom: 0;
    left: 17px;
    margin: auto;
	}
.event_detail_photo .next_arrow{
	width: 40px;
    height: 40px;
    background: #000;
    margin: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1000;
	cursor: pointer;
	}
.event_detail_photo .next_arrow::after{
	content:'';
	display: block;
    width: 9px;
    height: 9px;
    background: none;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
	position: absolute;
    top: 0;
    bottom: 0;
    right: 17px;
    margin: auto;
	}


.event_detail_photo li {
    display: inline-block;
    width: 90%!important;
    height: 0;
    padding-bottom: 90%;
    scroll-snap-align: center;
    margin: 0 15px 0 0;
	}
.event_detail_photo li:last-of-type{
	margin-right:0;
	}

.event_detail_photo li a:hover{
	opacity: 1!important;
	}
.event_detail_photo li img{
	width:100%;
	height:100%;
	margin:auto;
	}
.event_textarea{
	padding-right:15px;
}
.event_date{
	margin:15px 0 0 0 ;
	color:#AAA;
	font-size:10px;
	}
.event_name{
	color:#A25E5E;
	font-size:16px;
	font-weight: bold;
	}
.event_report{
	margin:10px 0 15px 0;
	color:#000;
	font-size:12px;
	}

a.btn_close{
	display: block;
	text-align: center;
	position: relative;
	}
a.btn_close::before{
	content:'';
	width:15px;
	height:15px;
	background: url(../img/hall/close.png) no-repeat center;
	background-size:cover;
	position:absolute;
	top:5px;
	left:calc(50% - 3em);
	}

a.btn_close:link{
	color:#000;
	}
a.btn_close:hover{
	text-decoration: none;
	opacity: 0.8;
	}
a.btn_close:visited{
	color:#000;
	}

#cboxMiddleLeft,
#cboxBottomLeft,
#cboxMiddleRight{
	display: none;
	}
#colorbox,
#cboxContent,
#cboxLoadedContent {
    box-sizing: border-box!important;
    -moz-box-sizing: border-box!important;
    -webkit-box-sizing: border-box!important;
	}
#cboxOverlay{
	background: #000!important;
	}
#cboxLoadedContent {
	margin:0;
	}

.pagenavi {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 25px 0 10px;
	}
.pagenavi a {
    width: 36px;
    height: 36px;
    color: #666!important;
    background: #fff;
    border: 1px solid #B1A9A9;
    padding: 12px 0;
    margin: 0 6px;
    font-size: 12px;
    line-height: 0.9;
    text-align: center;
    text-decoration: none;
    position: relative;
	}
.pagenavi a.prevpage:after {
    display: block;
    content: '';
    width: 7px;
    height: 7px;
    border-top: 1px solid #666;
    border-right: 1px solid #666;
    background: #fff;
    position: absolute;
    top: 0;
    right: 12px;
    bottom: 0;
    margin: auto;
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
	}
.pagenavi a.nextpage:after {
    display: block;
    content: '';
    width: 7px;
    height: 7px;
    border-top: 1px solid #666;
    border-right: 1px solid #666;
    background: #fff;
    position: absolute;
    top: 0;
    left: 12px;
    bottom: 0;
    margin: auto;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
	}
.pagenavi .current {
    display: block;
    border: 0px none;
    width: 36px;
    height: 36px;
    background: #B1A9A9;
    padding: 12px 0;
    margin: 0 6px;
    color: #fff;
    font-size: 12px;
    line-height: 0.9;
    text-align: center;
	}

/* ▼▼▼ 480px〜768px
=====================================*/
@media screen and (max-width: 768px) {

/* ▼▼▼ ミオホール トップ
=====================================*/
/* 共通 */
section{
    padding: 30px 20px;
    }

.accordion_area{
	display: none;
	}
h1.miohall_h1{
	font-size:24px;
	}
h4.open_sp{
	padding: 15px;
	position: relative;
	}
	h4.open_sp:before {
		content: "";
		background: #000;
		border-radius: 10px;
		width: 16px;
		height: 2px;
		position: absolute;
		top: 50%;
		right: 20px;
		transform: rotate(90deg);
		-webkit-transform: rotate(90deg);
		}
	h4.open_sp.close:before{
		display: none;
		}
	h4.open_sp:after {
		content: "";
		background: #000;
		border-radius: 10px;
		width: 16px;
		height: 2px;
		position: absolute;
		top: 50%;
		right: 20px;
		}
.accordion_inner{
	margin: 0 0 25px;
	}

table.fixtures_list{
	display: none;
	}
	table.fixtures_list th,
	table.fixtures_list td {
		padding: 15px;
		}

.map_img{
	margin: 0 0 30px;
	width: 100%;
	}

table.price_list{
	margin: 0 0 30px;
	}
	table.price_list tr th,
	table.price_list tr td{
		height: 50px;
		}
#scroll {
	margin: 30px auto 0;
	overflow: auto;
	white-space: nowrap;
	}
	#scroll table.price_list{
		table-layout: fixed;
		width: 650px;
		margin: 0 0 20px;
		}
	#scroll table.price_list tr th:nth-child(-n + 2){
		width: 130px;
		}
/*スクロールバーカスタム*/
#scroll::-webkit-scrollbar {
	height: 15px;
	}
	#scroll::-webkit-scrollbar-track {
		border-radius: 10px;
		background: #ccc;
		}
	#scroll::-webkit-scrollbar-thumb {
		background-color: #A09696;
		border-radius: 10px;
		}

table.info_list tr th,
table.info_list tr td{
	display: block;
	width: 100%;
    padding: 15px;
	}
	table.info_list tr th{
		border-right: 0 none;
		text-align: center;
		}
	table.info_list tr td{
		text-align: center;
		}
	table.info_list tr td p{
		display: inline-block;
		}




/* 201911 リニューアル時の追加css */
.main_slider_wrap .main_slider{
	width:100%;
	height:auto;
	margin:auto;
	background: #FDFAF2;
	}
	.main_slider_wrap .slick-slide > div li{
		height: 100vw!important;
		}
	.main_slider_wrap .white_block{
		width:200px;
		height:200px;
		}
		.main_slider_wrap .white_block p{
			font-size:30px;
			}
		.main_slider_wrap .white_block p span{
			font-size:14px;
			}

.wrap_bg_yellow section{
	padding-top:30px;
/*	padding-bottom:50px;*/
	}
.wrap_bg_yellow section p:first-of-type{
	font-size:16px;
	}
.wrap_bg_yellow section p:nth-of-type(2){
	font-size:24px;
	}
.wrap_bg_yellow section p:nth-of-type(3){
	font-size:13px;
	}
.wrap_bg_yellow .container {
	font-size:14px;
	text-align: left;
	}

/* 内観スライド */
.photo_slider.slick-slider{
	width:90vw;
	}
.photo_slider .slick-list {
    padding: 0 10% 0 0;
    overflow:hidden!important;
	}
.photo_slider div.slick-slide{
	margin:0 15px 0 0;
	}
	.photo_slider div.slick-slide:last-of-type{
		margin-right:0;
		}

.photo_slider li {
    margin: 0;
	}
.photo_slider li p {
    padding: 3px;
    font-size: 12px;
	}

/* ページ内リンクナビ */
ul.hall_sub_navi {
    padding: 12px 0;
	}
ul.hall_sub_navi li{
	flex: 1 0 0;
	}
ul.hall_sub_navi li a{
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	font-size:12px;
	padding: 0 0 12px 0;
	}
ul.hall_sub_navi li a::after {
    bottom: 4px;
	}

/* イベント事例 */
.event_slider.slick-slider{
	width: 90vw;
	}
.event_slider .slick-list {
    overflow: hidden!important;
    padding: 0 10% 0 0;
	}
.event_slider li{
	height: 0;
    padding-bottom: 100%;
	}
.event_slider li img{
	width:90vw;
	padding-bottom: 100%;
	margin:auto;
	}
.event_slider li span {
    padding: 3px;
    font-size: 12px;
	}
	.event_slider .slick-slide {
		margin:0 15px 0 0;
		}



.floor_plan{
	display:block;
	}
	table.hall_area{
		width:100%;
		}
	table.hall_area tr th,
	table.hall_area tr td{
		padding:6px;
		}
	#overview .table_wrap {
		width: 100%;
		}
	#overview .table_wrap > span{
		font-size:10px;
		}

#detail section:not(:first-of-type){
	padding:0 20px 30px;
	}

#contact p{
	text-align: left;
	}








/* ▼▼▼ ミオホール イベントアーカイブ
=====================================*/
#hall_event #main section{
	padding: 30px 10px;
	}

#cboxContent {
    width: 100%!important;
	}

#cboxLoadedContent {
    width: 100%!important;
	}
.inner_box {
    overflow: hidden;
	}
.event_detail_photo {
    height: 70vw;
    margin-left:  calc(10% - 10px);
	}
.event_detail_photo li {
    width: 70vw!important;
    height: 70vw;
	}
a.btn_close::before {
    top: 2px;
    left: calc(50% - 3.5em);
	}

.event_detail_photo .slick-list{
		padding: 0 10% 0 0;
	}

.event_detail_photo .slick-slide{
	margin: 0 15px 0 0;
	}




}



/* ▼▼▼ 〜320px
=====================================*/
@media screen and (max-width: 320px) {

	table.hall_area tr th,
	table.hall_area tr td{
		white-space: normal;
		}

}


