@charset "utf-8";
/* ===================================================================

 file name  :device.css
 style info :トップページ tablet sp

=================================================================== */

@media screen and (min-width: 600px){
  .pc{display:block !important;}
  .sp{display:none !important;}
}

@media screen and (max-width: 599px){
  .pc{display:none !important;}
  .sp{display:block !important;}
}

@media screen and (max-width: 1199.97px){
	#gnavReserve.pc,
	.js-cmn-reserve-menu-btn-pc.pc{
		display:none !important;
	}
	#gnavReserve.sp,
	.js-cmn-reserve-menu-btn-sp.sp{
		display:block !important;
	}
	
}


/* ******************************************************************* */
/*
/* PC版のレイアウト調整
/*
/* ******************************************************************* */

@media screen and (min-width:1201px){
	.head-overlay .bar{
		display:none;
	}
	.a-shade-cmn.-online-dark,
	html.is-reserve-menu-open-pc .o-menu.-pc{
		z-index:10001;
	}
	/*html.is-reserve-menu-open-pc .o-menu.-pc{
		height:max-content;
	}*/
    /*251211はま削除*/
	#footer .areanav dl{
		width:max-content;
	}
}

@media screen and (max-width:1200px) and (min-width:961px){

	/* header logo */
	
	#header .head-overlay>p.fixed-logo,
	#header .head-overlay.fixed>p.fixed-logo{
		display:none;
	}
	#header .nav-menus{
		display:none;
	}
	.head-overlay .bar{
		height: 68px;
		background: #000;
		position: relative;
		z-index:6000;
	}
	#menuBtn{
		display:block !important;
		position: absolute;
		right: 0;
		top: 0;
	}
	#menuBtn a{
		display: block;
	}
	#menuBtn a span{
		display: block;
		width:68px;
		height: 68px;
		overflow: hidden;
		text-indent: 100%;
		white-space: nowrap;
	}
	#menuBtn a::after,
	#menuBtn a span::before,
	#menuBtn a span::after{
		content:'';
		position: absolute;
		top:50%;
		left: 14px;
		height: 2px;
		width:40px;
		background: #FFF;
		transition: all ease .3s;
	}
	#menuBtn a span::before{
		margin-top: -11px;
	}
	#menuBtn a span::after{
		margin-top: 11px;
	}
	/* FIXED */
	#header .head-overlay.fixed{
		padding-top:0;
	}
}
@media screen and (max-width:1200px){
	/* bnrs-block */
	
	#main .bnrs-block ul{
		width: 60%;
	}
	#main .bnrs-block ul li{
		width:min(30vw, 230px);
	}
}

/* ==============================================================================================================================
   tablet
   ============================================================================================================================== */

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




	/* ---------------------------------------------------------------------------
			#header
	--------------------------------------------------------------------------- */
	#header{
		min-height: initial;
	}
	#topAnnounce{
		bottom:80px;
		left: 10px;
		max-width: 420px;
		top:inherit;
	}
	.is_touch #topAnnounce a:hover{color: #000;}



	.head-overlay{
		top: 100%;
		bottom:auto;
		margin-top: -68px;
		background: #000;
		z-index: 5999;
	}
	.head-overlay .bar{
		height: 68px;
		background: #000;
		position: relative;
		z-index:6000;
	}
	.head-overlay .bar::after{
		content:'';
		width:0;
		height: 1px;
		position: absolute;
		bottom:-1px;
		left: 0;
		background: #1070ae;
		transition: all ease .5s;
	}
	.gnavMenuIsOpen .head-overlay .bar::after{
		width:100%;
	}
	#header .head-overlay .fixed-logo,
	#header .head-overlay.fixed .fixed-logo{
		display: block;
		position: absolute;
		top:14px;
		left:14px;
		width:52px;
	}
	
		#menuBtn{
		position: absolute;
		right: 0;
		top: 0;
	}
	#menuBtn a{
		display: block;
	}
	#menuBtn a span{
		display: block;
		width:68px;
		height: 68px;
		overflow: hidden;
		text-indent: 100%;
		white-space: nowrap;
	}
	#menuBtn a::after,
	#menuBtn a span::before,
	#menuBtn a span::after{
		content:'';
		position: absolute;
		top:50%;
		left: 14px;
		height: 2px;
		width:40px;
		background: #FFF;
		transition: all ease .3s;
	}
	#menuBtn a span::before{
		margin-top: -11px;
	}
	#menuBtn a span::after{
		margin-top: 11px;
	}
	
	/*
		fixed
	*/
	#header .head-overlay.fixed{
		padding-top: 0;
		margin-top: 0;
	}
	#header .head-overlay.fixed #gnav{
		padding:0;
	}
	#header .head-overlay.fixed #gnav #gnavMenu{height: auto;}

	#header .head-overlay.fixed #gnav #gnavMenu > li#gnavReserve > a,
	#header .head-overlay.fixed #gnav #gnavMenu > li > span > a{
		line-height: 1.3;
	}

	#header .nav-menus{
		background: rgba(0,0,0,0.8);
		position: absolute;
		/*top:68px;*/
		bottom:0;
		left:0;
		width: 100%;
		/*height: calc(100vh - 68px);*/
		height: 100vh;
		padding: 0 0 68px;
		overflow-y: scroll;
		display: none;
	}
	#header .fixed .nav-menus{
		top:68px;
		bottom:auto;
		height: calc(100vh - 68px);
		padding: 0;
	}
	
	.gnavMenuIsOpen a::after{
		opacity: 0;
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	.gnavMenuIsOpen #menuBtn a span::before{
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
		margin-top: 0;
	}
	.gnavMenuIsOpen #menuBtn a span::after{
		margin-top: 0;
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}



	/* gnav */
	#gnav{
		font-size: 15px;
	}
	#gnav #gnavMenu{
		max-width: 100%;
		display: block;
		height: auto;
	}
	#gnav #gnavMenu > li{
		text-align: left;
		display: block;
	}
	#gnav #gnavMenu > li > span{
		background: none;
	}
	#gnav #gnavMenu > li > span > a{
		line-height: 1.3;
		padding: 1.5em 18px;
		background: #000;
		border-bottom:1px solid #595959;
	}

	#gnav #gnavMenu > li.drop > span::before{
		content:'';
		width: 24px;
		height: 2px;
		position: absolute;
		right:40px;
		top:50%;
		background: #FFF;
		margin-right: -11px;
		transition: all ease .3s;
		pointer-events: none;
	}
	#gnav #gnavMenu > li.drop > span::after{
		content:'';
		width: 2px;
		height: 24px;
		position: absolute;
		left:auto;
		right: 40px;
		margin-top: -11px;
		bottom:auto;
		top:50%;
		transition: all ease .3s;
		-ms-transform: scaleX(1);
		transform: scaleX(1);
		pointer-events: none;
	}
	#gnav #gnavMenu > li > span.no-cross::before {
		background: none; 
	}
	#gnav #gnavMenu > li > span.no-cross::after {
		background: none;
	}

	#gnav #gnavMenu > li.toggleOpen > span::after{
		-ms-transform: rotate(90deg);
		transform: rotate(90deg);
	}

	#gnav #gnavMenu > li#gnavReserve > a{
		line-height: 1.3;
		padding: 1.5em 18px;
	}


	/*.dropdown */
	.gnavdropmenu{
		position: relative;
		padding:0;
		-ms-transform: translateX(0);
		transform: translateX(0);
	}
	.upper .gnavdropmenu{
		bottom:auto;
	}
	.gnavdropmenu::before{display: none;}
	.gnavdropmenu .drop-inner{
		max-width: 100%;
		display: none;
	}
	#gnavDropdown-Search .drop-inner{
		border-left:none;
	}

	#gnavDropdown-Search .menu{
		width: 100%;
		padding-left: 0;
		float: none;
		border:none;
	}
	#gnavDropdown-Search .menu ul li {
		margin-bottom: 0;
		padding: 0;
		border-bottom:1px solid #d8d8d8;
	}
	#gnavDropdown-Search .menu ul li:last-child{
		border-color: #000;
		margin-bottom:0;
	}
	#gnavDropdown-Search .menu ul li a{
		line-height: 1.3;
		padding: 1em 1em 1em 40px;
	}
	/*#gnavDropdown-Search .menu ul li a:hover,
	#gnavDropdown-Search .menu ul li.drop.hover > a{
		color: #000;
	}*/
	#gnavDropdown-Search .menu ul li a::before{left: 25px;}
	#gnavDropdown-Search .menu ul li > a::before{transition: transform ease .3s;}
	#gnavDropdown-Search .menu ul li.toggleOpen > a::before{transform: rotate(90deg);}
	#gnavDropdown-Search .menu ul li a span{
		display: none;
	}
	#gnavDropdown-Search .menu ul li.drop-place a:hover,
	#gnavDropdown-Search .menu ul li.drop-place.hover > a{
		color: #000;
	}


	#gnavDropdown-Search .menu .pref{
		position: relative;
		left: 0;
		top:0;
		width: 100%;
		height: auto;
		background: #333;
		display: none;
	}
	#gnavDropdown-Search .menu .place{
		position: relative;
		left: 0;
		top:0;
		width: 100%;
		height: auto;
		background: #333;
		display: none;
	}
	#gnavDropdown-Search .menu .pref li,
	#gnavDropdown-Search .menu .place li{
		padding: 0;
		opacity: 1;
		transition: none;
		-ms-transform:none;
		transform:none;
		border-bottom:none;
	}
	#gnavDropdown-Search .menu .place li a{padding: 0.5em 1em 0.5em 100px;}
	#gnavDropdown-Search .menu .pref a{padding: 0.5em 1em 0.5em 80px;}
	#gnavDropdown-Search .menu .pref > li:first-child > a{padding-top: 1em;}
	#gnavDropdown-Search .menu .pref > li:first-child > a::before{margin-top:2px;}
	#gnavDropdown-Search .menu .pref > li:last-child > a{padding-bottom: 1em;}
	#gnavDropdown-Search .menu .pref > li:last-child > a::before{margin-top:-3px;}
	#gnavDropdown-Search .menu .pref a::before{left:60px; }
	#gnavDropdown-Search .menu .pref a:hover,
	#gnavDropdown-Search .menu .place a:hover{
		background: #121212 !important;
		color: #FFF !important;
	}
	#gnavDropdown-Search .menu .place a::before{left: 80px;}

	#gnavDropdown-Search .menu .over::-webkit-scrollbar,
	#gnavDropdown-Search .menu .over::-webkit-scrollbar-thumb {
	  display: none;
	}

	/** #gnavDropdown-Member **/
	#gnavDropdown-Member ul li{
		float: none;
		padding: 0;
		width: 100%;
		border-bottom: 1px solid #d8d8d8;
		border-left: none;
	}
	#gnavDropdown-Member ul li:last-child{border-color: #000;}
	#gnavDropdown-Member ul li a{
		line-height: 1.3;
		padding: 1em 1em 1em 40px;
		background: #333;
		border-bottom:none;
		position: relative;
	}
	#gnavDropdown-Member a p{
		display: inline;
		padding: 0px;
		font-weight: normal;
		transition: none;
		position: static;
	}
	#gnavDropdown-Member ul li a:hover p{padding-left: 0;}
	#gnavDropdown-Member a p::before{
		left: 25px;
		width: 8px;
	}
	
	/** #gnavDropdown-Grand **/
	#gnavDropdown-Grand ul li{
		float: none;
		padding: 0;
		width: 100%;
		border-bottom: 1px solid #d8d8d8;
		border-left: none;
	}
	#gnavDropdown-Grand ul li:last-child{border-color: #000;}
	#gnavDropdown-Grand ul li a{
		line-height: 1.3;
		padding: 1em 1em 1em 40px;
		background: #000;
		border-bottom:none;
		position: relative;
	}
	#gnavDropdown-Grand a p{
		display: inline;
		padding: 0px;
		font-weight: normal;
		transition: none;
		position: static;
	}
	#gnavDropdown-Grand ul li a:hover p{padding-left: 0;}
	#gnavDropdown-Grand a p::before{
		left: 25px;
		width: 8px;
	}
	
	
	/** #navDropdown-Selection **/
	#gnavDropdown-Selection ul li{
		float: none;
		padding: 0;
		width: 100%;
		border-bottom: 1px solid #d8d8d8;
		border-left: none;
	}
	
	#gnavDropdown-Selection ul li:last-child{border-color: #000;}
	#gnavDropdown-Selection ul li a{
		line-height: 1.3;
		padding: 1em 1em 1em 40px;
		background: #FFF;
		border-bottom:none;
		position: relative;
	}
	#gnavDropdown-Selection a p{
		display: inline;
		padding: 0px;
		font-weight: normal;
		transition: none;
		position: static;
	}
	#gnavDropdown-Selection ul li a:hover p{padding-left: 0;}
	#gnavDropdown-Selection a p::before{
		left: 25px;
		width: 8px;
	}
	
	
		/** #gnavDropdown-Point **/
	#gnavDropdown-Point ul li{
		float: none;
		padding: 0;
		width: 100%;
		border-bottom: 1px solid #d8d8d8;
		border-left: none;
	}
	#gnavDropdown-Point ul li:last-child{border-color: #000;}
	#gnavDropdown-Point ul li a{
		line-height: 1.3;
		padding: 1em 1em 1em 40px;
		background: #333;
		border-bottom:none;
		position: relative;
	}
	#gnavDropdown-Point a p{
		display: inline;
		padding: 0px;
		font-weight: normal;
		transition: none;
		position: static;
	}
	#gnavDropdown-Point ul li a:hover p{padding-left: 0;}
	#gnavDropdown-Point a p::before{
		left: 25px;
		width: 8px;
	}
	
	
	/* mv */
	#header .scroll{
	}
	#header .scroll::after{
	}

	#mv .btn-reserve{
		position: absolute;
		top:20px;
		left:10px;
		z-index: 4999;
	}
	#mv .btn-reserve a{
		padding: 8px 22px 8px 10px;
		background:#F90;
		color: #FFF;
		font-size: 14px;
		font-weight:bold;
		position: relative;
		border: 1px solid #FFF;
	}
	#mv .btn-reserve a::before,
	#mv .btn-reserve a::after{
		content:'';
		background: #FFF;
		position: absolute;
		right: 5px;
		top:50%;
		margin-top: 3px;
		width: 14px;
		height: 1px;
		transition: all ease .3s;
	}
	#mv .btn-reserve a::after{
		margin-top: 1px;
		width: 5px;
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	#pickupFeed{
		bottom: 68px;
		width: 270px;
		-ms-transform: translateX(0);
		transform: translateX(0);
	}
	#pickupFeed .inner{
		padding:10px 20px;
	}
	#pickupFeed.new .inner::after{
		font-size: 12px;
	}
	#pickupFeed .inner h3{
		font-size: 142%;
	}
	#pickupFeed .inner .feed h4{
		font-size: 100%;
	}
	#pickupFeed .inner .feed p{display: none;}
	#pickupFeed .btn-wrap{
		height: 32px;
	}
	#pickupFeed .btn-wrap a{
		height: 32px;
	}
	#pickupFeed .btn-wrap .btn-close{
		font-size: 100%;
		padding: 0 20px;
		line-height: 32px;
		height: 32px;
	}
	#pickupFeed .btn-wrap dl{
		padding: 9px 20px 0;
		height: 32px;
		line-height: 14px;
	}
	#pickupFeed .btn-wrap .ico-close{
		top:8px;
		right: 10px;
		width: 16px;
		height: 16px;
	}
	#pickupFeed .btn-wrap .ico-close::before,
	#pickupFeed .btn-wrap .ico-close::after{
		top:50%;
		width: 16px;
	}



	/* ---------------------------------------------------------------------------
		#content
	--------------------------------------------------------------------------- */
	#content{
	}


	/* -------------
		movie-bnrs
	-------------------------- */
	.movie-bnrs ul{
		font-size: 134%;
	}

	/* bnrs-block */
	
	#main .bnrs-block ul{
		width: 80%;
	}
	#main .bnrs-block ul li{
		width:min(30vw, 230px);
	}

	/* -------------
		agContents
	-------------------------- */
	#main #agContents #mapSearch .select h4{
		top:30px;
		left: 30px;
		font-size: 150%;
	}
	/*
	.no_touch #main #agContents #course a.main::after{
		content:'';
		position: absolute;
		top:0;
		left: 0;
		width: 100%;
		height: 100%;
		background: #1070ae;
		-ms-transform:translateX(-100%);
		transform:translateX(-100%);
		opacity: 0;
		transition: all ease .5s;
	}
	.no_touch #main #agContents #course a.main:hover::after{
		-ms-transform:translateX(0);
		transform:translateX(0);
		opacity: 1;
	}
	.no_touch #main #agContents #course .notes .name::after{
		content:'';
		background: #FFF;
		position: absolute;
		width: 100%;
		height: 100%;
		top:0;
		left: 0;
		transition: all ease .5s;
		z-index: -1;
		opacity: 0;
	}
	.no_touch #main #agContents #course a.main:hover .name::after{
		width: 100%;
		opacity: 1;
	}
	.no_touch #main #agContents #course a.main:hover .name {color: #1070ae;}
	*/


	/* -------------
		content-block
	-------------------------- */
	#main .content-block .content-block-inner{
		padding: 0;
	}
	#main .content-block section a.main::before{cursor: pointer;}
	/*
	#main .content-block section.show-overbtns a.main::before{
		width: 100%;
	}
	*/
	#main .content-block section .item{
		padding-bottom: 43.75%;
		width: 50%;
	}
	#main .content-block section .ttl{
		padding-bottom: 300px;
		width: 100%;
		float: none;
		clear: both;
	}
	#main .content-block section .ttl h3{
		width: 100%;
		top: 68px;
		font-size: 300%;
	}


	#main .content-block section#member.hover .ttl .btn-detail span,
	#main .content-block section#member.show-overbtns .ttl .btn-detail span{
		background: #FFF;
		color:#515151;
	}
	.is_touch #main .content-block section#member.hover .ttl .btn-detail span,
	.is_touch #main .content-block section#member.show-overbtns .ttl .btn-detail span{
		background: #515151;
		color:#FFF;
	}
	#main .content-block section#member.hover .ttl .btn-detail span::before,
	#main .content-block section#member.hover .ttl .btn-detail span::after,
	#main .content-block section#member.show-overbtns .ttl .btn-detail span::before,
	#main .content-block section#member.show-overbtns .ttl .btn-detail span::after{
		background: #515151;
	}
	.is_touch #main .content-block section#member.hover .ttl .btn-detail span::before,
	.is_touch #main .content-block section#member.hover .ttl .btn-detail span::after,
	.is_touch #main .content-block section#member.show-overbtns .ttl .btn-detail span::before,
	.is_touch #main .content-block section#member.show-overbtns .ttl .btn-detail span::after{
		background: #FFF;
	}
	#main .content-block section#member.hover .ttl .btn-detail,
	#main .content-block section#member.show-overbtns .ttl .btn-detail{	opacity: 1;	}



	/* hover */
	.is_touch #main .content-block section#grand.hover .ttl{	box-shadow: none;}
	.is_touch #main .content-block section#grand.hover .ttl .btn-detail span{
		background: #0b2447;
		color:#FFF;
	}
	.is_touch #main .content-block section#grand.hover .ttl .btn-detail span::before,
	.is_touch #main .content-block section#grand.hover .ttl .btn-detail span::after{
		background: #FFF;
	}

	.is_touch #main .content-block section#campaign.hover .ttl{	box-shadow: none;}
	.is_touch #main .content-block section#campaign.hover .ttl .btn-detail span{
		background: #FFF;
		color:#000;
	}
	.is_touch #main .content-block section#campaign.hover .ttl .btn-detail span::before,
	.is_touch #main .content-block section#campaign.hover .ttl .btn-detail span::after{	background: #000;}

	.is_touch #main .content-block section#member.hover .ttl{box-shadow: none;}





	/* #grand */
	.is_touch #main .content-block section#grand a.main::before{display: none;}
	#main .content-block section#grand .ttl h3{top:80px;}
	.is_touch #main .content-block section#grand.hover .inner{ transform: scale(1);}

	/* #campaign */
	.is_touch #main .content-block section#campaign a.main::before{display: none;}
	#main .content-block section#campaign .box1{
		width: 100%;
	}
	#main .content-block section#campaign .ttl{
		left: 0;
	}
	#main .content-block section#campaign .box1{
		left:0;
	}
	.is_touch #main .content-block section#campaign.hover .inner{transform: scale(1);}

	/* #member */
	#main .content-block section#member .ttl{
		left: 0;
	}
	#main .content-block section#member .box1{
		left: 0;
	}
	.is_touch #main .content-block section#member.hover .inner{transform: scale(1);}

	#main .content-block section#member .overbtns	{height: 0; padding: 0 10px;}
	#main .content-block section#member.hover .overbtns,
	#main .content-block section#member.show-overbtns .overbtns	{height: auto;}
	#main .content-block section#member .overbtns ul{
		-ms-transform: translateY(100%);
		transform: translateY(100%);
		opacity: 0;
		transition: all ease .4s;
		transition-delay: 0s;
	}
	#main .content-block section#member.hover .overbtns ul{
		-ms-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
		transition-delay: .4s;
	}
	/*
	#main .content-block section#member.show-overbtns .overbtns ul{
		-ms-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
		transition-delay: .4s;
	}
	*/
	#main .content-block section#member .overbtns li a{
		padding: 5em 0.8em;
	}


	#main .content-block #member .close{
		position: absolute;
		top:15px;
		right: 15px;
		z-index:10;
		opacity: 0;
		pointer-events: none;
		transition: opacity ease .3s;
	}
	/*
	#main .content-block #member.show-overbtns .close{
		opacity: 1;
		pointer-events: auto;
	}
	*/
	#main .content-block #member .close a{
		display: block;
		width: 30px;
		height: 30px;
		overflow: hidden;
		text-indent: 100%;
		white-space: nowrap;
	}
	#main .content-block #member .close a::before,
	#main .content-block #member .close a::after{
		content:'';
		background: #FFF;
		position: absolute;
		top:50%;
		left: 0;
		height: 2px;
		width: 100%;
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
		transition: background ease .3s;
	}
	#main .content-block #member .close a::after{
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}





	/* -------------
		pickup
	-------------------------- */
	#main #pickup{
		padding: 80px 0 170px;
	}


	/* -------------
		SHIBAFU
	-------------------------- */
	#main #shibafu{
		padding: 110px 15px 120px;
	}
	#main #shibafu .o-shibafu__cards{
		align-items:top;
		display:flex;
		flex-wrap:wrap;
		gap:20px;
		margin:0 auto;
		width:min(100%,1300px);
	}
	#main #shibafu .o-shibafu__card{
		flex-basis:unset;
		margin:0 !important;
		padding:0;
		width:calc((100% - 20px) / 2);
	}


	/* -------------
		other
	-------------------------- */
	#main #other .other-outer{
		padding: 80px 22px;
	}
	#main #otherSlider li{
		padding: 0 10px;
	}
	/* Arrows */
	#main #other .slick-prev{
	  left: -30px;
	}
	#main #other .slick-next{
		right: -30px;
		left: auto;
	}
	#main #other .slick-prev:hover::after,
	#main #other .slick-prev:hover::before{left: 20px;}
	#main #other .slick-next:hover::after,
	#main #other .slick-next:hover::before{left:10px;}





	/* -------------
		news fb
	-------------------------- */
	#main .news-fb-outer{
		padding: 80px 20px;
	}
	#main #news{
		width: 100%;
		float: none;
	}







	#main #fb{
		width: 100%;
		max-width: 500px;
		margin: 70px auto 0;
		float: none;
	}



	/* ---------------------------------------------------------------------------
		#pageTop
	--------------------------------------------------------------------------- */
	#pageTop{
		right: 20px;
		bottom:20px;
	}


	/* ---------------------------------------------------------------------------
		#footer
	--------------------------------------------------------------------------- */
	#footer #sitemap .grid-sizer{ width: 25%; }
	#footer #sitemap .block{
		width: 25%;
		padding:0 20px;
	}





/* end tablet */
}


/*

	間の調整

*/
@media screen and (max-width: 830px){

	/* -------------
		movie-bnrs
	-------------------------- */
	.movie-bnrs br{
		display: block;
	}

	#main #agContents .wrap section{	width: 100%; float: none !important;}
	#main #agContents #mapSearch .select .area li a{	font-size: 117%;}
	#main #agContents #mapSearch .select .area li.hokkaido{top: 5%;}
}


@media screen and (max-width: 700px){
	/* ---------------------------------------------------------------------------
		#footer
	--------------------------------------------------------------------------- */
	#footer #sitemap .grid-sizer{ width: 33.3%; }
	#footer #sitemap .block{
		width: 33.3%;
		padding:0 15px;
	}
}






/* ==============================================================================================================================
   sp
   ============================================================================================================================== */
@media screen and (max-width: 600px){




	/* ---------------------------------------------------------------------------
			#header
	--------------------------------------------------------------------------- */

	/* hnav */
	.hnav{
		position: static;
		border-bottom:1px solid #000;
	}
	.hnav li{
		width:calc(100% / 3);
	}
	.hnav li a{
		padding:0 15px;
		color: #000 !important;
		background: #FFF !important;
		font-size: 13px;
		line-height: 48px
	}
	.hnav .hnavMypage a::before{
		background: url(/assets/images/top/ico_mypage_black.png) no-repeat;
		background-size:cover;
		left: 50%;
		margin-left: -3.5em;
	}
	.hnav .hnavMypage a{
		padding-right: 0;
	}
	.hnav .hnavCi a,
	.hnav .hnavQa a{
		border-left:1px solid #595959;
	}
	.hnav .hnavMypage a:hover,
	.hnav .hnavCi a:hover,
	.hnav .hnavQa a:hover{
		box-shadow: none;
	}
	/* 多言語対応 */
	.translate dl{
		border-bottom:1px solid #000;
		display:flex;
		flex-wrap:wrap;
		text-align:center;
	}
	.translate dt{
		background:rgba(40,200,100,0.6);
		border-bottom:1px solid #000;
		color:#FFF;
		font-size:13px;
		padding:10px 0;
		width:100%;
	}
	.translate dt:before{
		aspect-ratio:1;
		background:url(/assets/images/top/icon_global_white.svg) no-repeat;
		background-size:contain;
		content:'';
		display:inline-block;
		margin-right:5px;
		translate:0 2px;
		width:1.0em;
	}
	.translate dd{
		border-left:1px solid #595959;
		width:calc(100% / 3);
	}
	.translate dd:nth-of-type(1){
		border-left:none;
	}
	.translate dd a{
		background:#FFF !important;
		color:#000 !important;
		display:inline-block;
		font-size:13px;
		line-height:40px;
		padding:0 15px;
		width:100%;
	}
	.translate dd button{
		background:#FFF !important;
		color:#000 !important;
		display:inline-block;
		font-size:13px;
		line-height:40px;
		padding:0 15px;
		width:100%;
	}

	#topAnnounce{
		top:auto;
		left:5%;
		bottom:34px;
		width: 90%;
		margin: 0 auto;
		max-width: 100%;
		text-align: left;
		font-size: 109%;
	}



	.head-overlay{
		top: 0 !important;
		margin-top: 0;
		background: transparent;
		position: fixed;
		transition: background ease .3s;
	}
	.gnavMenuIsOpen #header .head-overlay{background: #000;}
	.head-overlay .bar{
		height: 44px;
		/*background: transparent;*/
	}
	#header .head-overlay .fixed-logo{
		opacity: 1;
	}
	.gnavMenuIsOpen #header .head-overlay .fixed-logo{opacity: 1;}

	#header .head-overlay .fixed-logo,
	#header .head-overlay.fixed .fixed-logo{
		top:6px;
		left:8px;
		height:32px;
		width: auto;
	}
	#header .head-overlay.fixed .fixed-logo{opacity: 1;}
	/*
		fixed
	*/
	#header .head-overlay.fixed{
		background: #000;
		padding-top: 0;
		margin-top: 0;
	}
	#header .head-overlay.fixed #gnav{
		padding:0;
	}
	#header .head-overlay.fixed #gnav #gnavMenu{height: auto;}

	#header .head-overlay.fixed #gnav #gnavMenu > li#gnavReserve > a,
	#header .head-overlay.fixed #gnav #gnavMenu > li > span > a{
		line-height: 1.3;
	}

	#header .nav-menus,
	#header .fixed .nav-menus{
		top:44px;
		height: calc(100vh - 44px);
	}

	#menuBtn a span{
		width:44px;
		height: 44px;
	}
	#menuBtn a::after,
	#menuBtn a span::before,
	#menuBtn a span::after{
		top:50%;
		left: 10px;
		height: 2px;
		width:25px;
	}
	#menuBtn a span::before{
		margin-top: -8px;
	}
	#menuBtn a span::after{
		margin-top: 8px;
	}



	/* gnav */
	#gnav{
		font-size: 13px;
	}
	#gnav #gnavMenu > li > span > a{
		padding: 1.2em 15px;
	}

	#gnav #gnavMenu > li > span::before{
		width: 12px;
		height: 2px;
		right:20px;
		margin-right: -5px;
	}
	#gnav #gnavMenu > li > span::after{
		height: 12px;
		right: 20px;
		margin-top: -5px;
	}
	#gnav #gnavMenu > li#gnavReserve > a{
		padding: 1.2em 15px;
	}


	/*.dropdown */
	.gnavdropmenu{
		font-size: 13px;
	}

	#gnavDropdown-Search .menu ul li a{
		padding: 1em 1em 1em 40px;
	}

	#gnavDropdown-Search .menu .pref a{padding-left:60px;}
	#gnavDropdown-Search .menu .place li a{padding-left:80px;}
	#gnavDropdown-Search .menu .pref > li > a::before{left:42px;}
	#gnavDropdown-Search .menu .place > li > a::before{left:62px;}





	/* mv */
	#mv .btn-reserve{
		position: absolute;
		top:14px;
		left:9px;
		z-index: 7777;
	}
	.gnavMenuIsOpen #mv .btn-reserve{z-index: 1000;}
	#mv .btn-reserve a{
		padding: 8px 22px 8px 10px;
		background:#F90;
		color: #FFF;
		font-size: 12px;
		font-weight:bold;
		position: relative;
		border: 1px solid #FFF;
	}
	#mv .btn-reserve a::before,
	#mv .btn-reserve a::after{
		content:'';
		background: #FFF;
		position: absolute;
		right: 5px;
		top:50%;
		margin-top: 3px;
		width: 14px;
		height: 1px;
		transition: all ease .3s;
	}
	#mv .btn-reserve a::after{
		margin-top: 1px;
		width: 5px;
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	/* catch */

	#mv .mv-inner .common-catch,
	#mv #mvSlider .item .catch{
		width: 80%;
		-ms-transform:translate(-50%, -70%);
		transform:translate(-50%, -70%);
	}
	#mv #mvSlider .item .catch2{
		width:100%;
		-ms-transform:translate(0,0);
		transform:translate(0,0);
	}
	#mv #mvSlider .item .catch3{
		width: 96%;
		-ms-transform:translate(-50%, -70%);
		transform:translate(-50%, -70%);
	}
	#mv #mvSlider .item .catch4{
		width: 96%;
		-ms-transform:translate(-50%, -70%);
		transform:translate(-50%, -70%);
	}
	#mv .mv-inner .common-catch{
		width: 100%;
	}


	#mv .pcSlider-wrap{
		display:none;
	}
	#mv .spSlider-wrap{
		display:block;
	}
	#mv .slick-dots {
    top: 60px;
    right: 5px;
	}
	/* scroll */
	#header .scroll{
	  font-size: 13px;
	  padding-bottom: 30px;
	}
	#header .scroll::after{
		margin-left: -15px;
		bottom: 15px;
		width: 30px;
		height: 30px;
	}
	@media all and (orientation: landscape) {
		#mv .mv-inner .common-catch,
		#mv #mvSlider .item .catch{
			width: auto;
			height: 45vh;
			top: 10%;
			-ms-transform:translate(-50%, 0);
			transform:translate(-50%, 0);
		}
		#mv .mv-inner .common-catch{
			height: 70vh;
		}
		#mv .mv-inner .common-catch img,
		#mv #mvSlider .item .catch img{
			width: auto;
			height: 100%;
		}
		/* scroll */
		#header .scroll{
		  bottom:80px;
		}

	}


	#pickupFeed{
		bottom: 0;
		width: 100%;
		min-width: 100%;
	}
	#pickupFeed .inner{
		padding:10px;
	}
	#pickupFeed.new .inner::after{
		width: 38px;
		height: 38px;
	}

	#pickupFeed .inner h3{margin-bottom: 0;}
	#pickupFeed .inner .feed figure{
		width: 35%;
		float: left;
		margin: 0 1em 1em 0;
	}
	#pickupFeed .inner .feed h4{
		font-size: 109%;
	}




	/* ---------------------------------------------------------------------------
		#content
	--------------------------------------------------------------------------- */
	#content{
	}


	/* -------------
		movie-bnrs
	-------------------------- */
	.movie-bnrs br{
		display: none;
	}
	.movie-bnrs ul{
		border-top: none;
		font-size: 100%;
	}
	.movie-bnrs ul li{
		width: 100%;
	}
	.movie-bnrs ul li a span{
		max-width: 210px;
	}
	.movie-bnrs ul .hgolfers{letter-spacing: 0;}


	/* bnrs-block */
	
	#main .bnrs-block ul{
		width:100%;
	}


	/* -------------
		agContents
	-------------------------- */
	#main #agContents{
		padding:30px 0 0;
	}
	#main #agContents h2{
		font-size: 192%;
		margin-bottom: 36px;
	}


	#main #agContents a.main{padding-bottom: 95.3%;}
	#main #agContents .notes .ttl{
		margin: 0 20px 2em;
	}
	#main #agContents .notes .ttl h3{
		font-size: 150%;
	}
	#main #agContents .notes .texts{
		padding: 0 20px 12px;
	}
	#main #agContents .notes .name{
		width: 190px;
		font-size: 125%;
	}
	#main #agContents .notes .txt{
		font-size: 100%;
    margin-bottom: 1em;
    line-height: 1.5;
	}





	#main #agContents #mapSearch .select h4{
		top:15px;
		left: 15px;
		font-size: 117%;
	}
	#main #agContents #mapSearch .select .area li{padding: 0;}
	#main #agContents #mapSearch .select .area li a{
		border-width:2px;
		font-size: 84%;
    padding: 0.3em 1em;
    /*box-shadow: 0 0 0 2px #64b2e5*/
	}
	#main #agContents #mapSearch .select .area li.zenkoku a {
    padding: 1em 1em;
    line-height: 2em;
    font-size: 100%;
	}
	#main #agContents #mapSearch .select .area li.tokai {bottom: 66%;}
	#main #agContents #mapSearch .select .area li.kansai {bottom: 48%;}
	#main #agContents #mapSearch .select .area li.kanto {right: 0; left:auto;}
	#main #agContents #mapSearch .select .area li.kanto a{width: 9em;}


	#main #agContents #mapSearch .select .area li a{	font-size: 100%;}
	#main #agContents #mapSearch .select .caption {font-size: 82%; padding: 0 10px;}
	#main #agContents #mapSearch .select .mapSearch-close {
    top: 10px;
    right: 10px;
	}
	#main #agContents #mapSearch .pref-select div{width:90%; margin-top: 10px;}
	#main #agContents #mapSearch .pref-select div .close{ top:-30px; right: -4px;}

	#main #agContents #mapSearch .pref-select div ul li a{
		border-width:2px;
		font-size:12px;
    padding: 0.3em 1em;
	}
	#main #agContents #mapSearch .pref-select div ul li.area-kyushu {left: 50%;transform: translateX(-30%);}
	#main #agContents #mapSearch .pref-select div ul li.area-kanto {left: 50%;transform: translateX(-50%);}


	/* -------------
		PICK UP
	-------------------------- */
	#main #pickUp{
		padding: 40px 0;
	}
	#main #pickUp h2{
		margin-bottom: 1em;
		font-size: 150%;
	}
	#main #pickUp .btn-all{
		padding-right: 20px;
		margin-bottom: 15px;
		font-size: 100%;
	}
	#main #pickUp .btn-all a::after { margin-top: -4px;}
	#main #pickUp #selectonSlider{margin: 0;}
	#main #pickUp #selectonSlider ul li{padding: 0 10px;}

	#main #pickUp #selectonSlider ul li a h4{
		font-size: 109%;
	}
	#main #pickUp #selectonSlider ul li a h4 span{	font-size: 89%;}
	/* Arrows */
	#main #pickUp .slick-prev,
	#main #pickUp .slick-next{
		width: 30px;
		top: -40px;
	}
	#main #pickUp .slick-prev{
	  left: 20px;
	}
	#main #pickUp .slick-next{
		left: 50px;
	}
	#main #pickUp .slick-prev:hover::after,
	#main #pickUp .slick-prev:hover::before{left:0; background:#151111; }
	#main #pickUp .slick-next:hover::after,
	#main #pickUp .slick-next:hover::before{right:0; background:#151111;}



	/* -------------
		content-block
	-------------------------- */
	#main .content-block section .item{
		padding-bottom: 43%;
	}
	#main .content-block section .ttl{
		padding-bottom: 138px;
	}
	#main .content-block section .ttl h3{
		top: 25px;
		font-size: 150%;
	}
	#main .content-block section .ttl h3 span {
    padding-top: 1em;
    font-size: 10px;
	}
	#main .content-block section .ttl .btn-detail {
    bottom: 20px;
	}

	#main .content-block section#grand .ttl h3{top:30px;}
	#main .content-block section#member .overbtns li a{	padding: 2em 0.8em;	}






	/* -------------
		pickup
	-------------------------- */
	#main #pickup{
		padding: 40px 0 80px;
	}
	#main #pickup h2{
		margin-bottom: 30px;
		font-size: 192%;
	}
	#main #pickup h2 small{
		font-size: 10px;
	}


	#main #pickup #pickupSlider ul li{
		padding: 0 10px;
	}
	#main #pickup #pickupSlider ul li .inner{
		padding: 15px;
		-ms-transform: scale(1);
		transform: scale(1);
	}


	#main #pickup #pickupSlider ul li a figure{
		width: 100%;
		float: none;
	}
	#main #pickup #pickupSlider ul li a .notes{
		width: 100%;
		float: none;
		padding-bottom: 20px;
	}
	#main #pickup #pickupSlider ul li a .notes h4{
		font-size: 109%;
		margin: 1em 0;
	}
	#main #pickup #pickupSlider ul li a .notes .txt{
		font-size: 100%;
	}
	#main #pickup #pickupSlider ul li a .notes .btn-detail{
		left: auto;
		right: 0;
	}
	#main #pickup #pickupSlider .slick-dots{
	  bottom: -40px;
	}


	/* -------------
		SHIBAFU
	-------------------------- */

	#main #shibafu h2 a:after{
		right:0;
		top:0;
		translate:-10% -20%;
		width:min(23vw,140px);
	}
	#main #shibafu p.o-shibafu__card__heading{
		font-weight:500;
		padding:10px 10px 20px;
	}



	/* -------------
		other
	-------------------------- */
	#main #other{
		padding-top: 100px;
	}
	#main #other .other-outer{
		padding: 0 40px;
	}
	#main #otherSlider li{
		padding: 0 5px;
	}

	#main #otherSlider{
		position: relative;
		top:-60px;
	}

	#main #otherSlider li a .notes{
		padding:13px 0;
		margin: 0 13px;
	}
	#main #otherSlider li a .notes h4{
		font-size: 109%;
	}
	#main #otherSlider li a .notes p{
		font-size: 100%;
	}

	#main #otherSlider li a .btn-detail span{
		font-size: 100%;
	}

	/* Arrows */
	#main #other .slick-prev{
	  left: -40px;
	}
	#main #other .slick-next{
		right: -40px;
		left: auto;
	}
	#main #other .slick-prev:hover::after,
	#main #other .slick-prev:hover::before{left: 20px;}
	#main #other .slick-next:hover::after,
	#main #other .slick-next:hover::before{left:10px;}



	/* -------------
		news fb
	-------------------------- */
	#main .news-fb-outer{
		padding: 40px 10px;
	}

	#main #news .ttl::after{
		width: 60px;
	}
	#main #news .ttl h3{
		font-size: 192%;
	}
	#main #news .ttl h3 small{
		display: block;
		font-size: 10px;
	}
	#main #news .btn-all{
		font-size: 100%;
	}
	#main #news .btn-all a::after { margin-top: -4px;}

	#main #news #divDataArea article{
		font-size: 92%;
	}
	#main #news #divDataArea article a{
		padding: 2em 50px 2em 1.5em;
	}
	#main #news #divDataArea article a::before{
		width: 18px;
		height: 4px;
		margin-top: -2px;
	}
	#main #news #divDataArea article a::after{
		content:none;
	}
	#main #news #divDataArea article p{
		font-size: 10px;
	}



	#main #fb{
		width: 100%;
		max-width: 500px;
		margin: 20px auto 0;
	}

	/* -------------
		bnrs-block
	-------------------------- */
	#main .bnrs-block{
		/*margin: 0 auto 40px;*/
	}
	#main .bnrs-block ul{
		/*margin: 0;*/
	}
	#main .bnrs-block ul li{
		width: 48%;
	}



	/* ---------------------------------------------------------------------------
		#pageTop
	--------------------------------------------------------------------------- */
	#pageTop{
		right: 20px;
		bottom: 60px;
	}
	#pageTop a{
	  font-size: 12px;
	  padding-top: 45px;
	}
	#pageTop a::after,
	#pageTop a:hover::after{
		height: 20px;
		top: 20px;
	}
	#pageTop a::before,
	#pageTop a:hover::before{
		height: 6px;
		-ms-transform: rotate(30deg);
		transform: rotate(30deg);
		top: 20px;
	}





	/* ---------------------------------------------------------------------------
		#footer
	--------------------------------------------------------------------------- */

	#footer .areanav{
		background: #e9e9e9;
		padding: 5px;
		font-size: 109%;
	}
	#footer .areanav dl{
		padding-left: 0.5em;
	}
	#footer .areanav dl dt{
		position: static;
		margin-top: 0;
		font-size: 15px;
		padding:0.5em;
		text-align: center;
		translate:inherit;
		width:100%;
	}
	#footer .areanav dl dd{
		width:calc((100% - 3px) /2);
		margin: 0;
	}
	#footer .areanav dl dd:nth-of-type(1){width: 100%;}



	#footer #sitemap{
		padding:30px 10px;
	}
	#footer #sitemap h3{
		font-size: 125%;
	}
	#footer #sitemap .grid-sizer{ width: 50%; }
	#footer #sitemap .block{
		width:50%;
		padding:0 10px;
	}
	#footer #sitemap .block dt{
		font-size: 10px;
	}
	#footer #sitemap .block dd{
		font-size: 10px;
	}


	#footer .subnav{
		padding:0;
	}
	#footer .subnav ul{
		font-size: 10px;
		overflow: hidden;
	}
	#footer .subnav ul li{
		width: 50%;
		float: left;
		display: block;
		padding:0.8em 0;
		border-top:1px solid #767676;
	}
	#footer .subnav ul li:nth-of-type(1),
	#footer .subnav ul li:nth-of-type(2){	border-top:none;}
	#footer .subnav ul li:nth-of-type(odd){	border-right: 1px solid #767676;}
	#footer .subnav ul li::after{
		content:none;
	}

	#footer .foot-inner{
		padding: 50px 15px 30px;
	}
	#footer .foot-inner .logo{
		width: 64px;
		margin: 0 auto 30px;
	}
	#footer .foot-inner .socials{
		letter-spacing:-0.4em;
        /*251212hamastart*/
        width: 140px;
        /*width: 90px;*/
        /*251212hamaend*/
		padding: 0;
	}
	#footer .foot-inner .socials li{
		letter-spacing:normal;
		width: 40px;
	}
	#footer .foot-inner .socials li.btn-insta{
		margin-left:10px;
	}
    /*251212hamastart*/
	#footer .foot-inner .socials li.btn-line{
		margin-left:10px;
	}
    /*251212hamaend*/
	#footer .foot-inner .socials li a{
		background-size:15px;
		width: 40px;
		height: 40px;
	}
	#footer .foot-inner .socials li.btn-mail a{
		background-size:15px;
	}
	#footer .foot-inner .socials li.btn-insta a{
		background-size:15px;
	}
    /*251212hamastart*/
	#footer .foot-inner .socials li.btn-line a{
		background-size:15px;
	}
    /*251212hamaend*/
	#footer .foot-inner .socials li a:hover{
		border: 1px solid #454545;
		background-color: #454545;
		-ms-transform: none;
		transform: none;
	}
	#footer .copyright{
		font-size: 10px;
	}
}

/* ========================================================================== */
/*
/* MEMBERSHIP（会員権・P-CAP）のメニュー数変更対応 [2020.11.20]
/* ※レスポンシブ以外の記述は、index.css
/*
/* ========================================================================== */

@media screen and (max-width:960px){
	#main .content-block section#member .overbtns li a{
		padding:3em 0.8em;
	}
}
@media screen and (max-width:699px){
	#main .content-block section#member .overbtns li a{
		padding:1em 0.8em;
	}
}
@media screen and (max-width:619px){
	#main .content-block section#member .item {
		padding-bottom: 40%;
	}
	#main .content-block section#member .overbtns li{
		width:47%;
	}
	#main .content-block section#member .overbtns li a{
		font-size:120%;
		padding:0.8em;
	}
	#main .content-block section#member .overbtns li:nth-child(2n){
		margin-right:0;
	}
	/*#main .content-block section#member .overbtns li:nth-child(3){
		margin-right:4.2%;
	}*/
}
