@charset "utf-8";

/** ==================================================================

	8ablish portal top css for PC

====================================================================== */



	#eightablishFooter{
		margin			: 100px auto 0;
	}



/* -------------------------------------------------------------------
	Block Common
---------------------------------------------------------------------- */



	.indexBlock {
		display			: block;
		position		: relative;
		margin			: 0;
		padding			: 0;
	}
	.indexBlock:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }


	.indexBlock img {
		width			: auto;
		max-width		: 100%;
		border			: 0;
	}



/* -------------------------------------------------------------------
	Slider Block
---------------------------------------------------------------------- */



	#indexSlider {
		width			: 100%;
	}
	#indexSlider:before { 
		content			: "";
    	display			: block;
		margin			: 0;
		padding			: 56.25% 0 0 0;
	}



	/* Reset ------------------------------------- */

	#indexSlider ul,
	#indexSlider ul li,
	#indexSlider dl,
	#indexSlider dl dt,
	#indexSlider dl dd {
		margin			: 0;
		padding			: 0;
		list-style-type	: none;
	}

	#indexSlider img {
		vertical-align	: bottom;
	}



	/* Slider Show ------------------------------- */

	#indexSlider .slideshow {
	    position		: absolute;
	    top				: 0;
	    left			: 0;
	    bottom			: 0;
	    right			: 0;
	}


	#indexSlider .slideshow .slider {
		display			: block;
	    position		: relative;
		width			: 100%;
		height			: 100%;
		margin			: 0;
		padding			: 0;
		overflow		: hidden;
	}


	#indexSlider .slideshow .slider ul {
		display			: block;
	    position		: relative;
		width			: 1000%;
		height			: 100%;
	}

	#indexSlider .slideshow .slider ul li {
		display			: block;
	    position		: relative;
		float			: left;
		width			: 10%;
		height			: 100%;
	}

	#indexSlider .slideshow .slider ul li a {
		display			: block;
	    position		: relative;
		width			: 100%;
	}

	#indexSlider .slideshow .slider ul li a img {
		display			: block;
	    position		: relative;
		width			: 100%;
	}


	#indexSlider .slideshow .pointer {
		display			: block;
		position		: relative;
		margin			: 10px 0 0;
		padding			: 0;
		overflow		: hidden;
	}

	#indexSlider .slideshow .pointer ul {
		position		: relative;
		float			: left;
		left			: 50%;
	}
	#indexSlider .slideshow .pointer ul:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

	#indexSlider .slideshow .pointer ul li {
		position		: relative;
		float			: left;
		left			: -50%;
		margin			: 0 5px;
	}

	#indexSlider .slideshow .pointer ul li a {
		display			: block;
		width			: 6px;
		height			: 6px;
		text-align		: center;
		cursor			: pointer;
		font-size		: 1pt;
		border-radius	: 3px;
		background		: #231815;
		text-indent		: -9999px;
		overflow		: hidden;
		transition		: 0.3s;
	}

	#indexSlider .slideshow  .pointer ul li a:hover {
		background		: #faee00;
	}


	#indexSlider .slideshow .pointer ul li.sel a {
		background		: #faee00;
	}



	#indexSlider .slideshow .direction {


	}

	#indexSlider .slideshow .direction p {
		display			: block;
		position		: absolute;
		top				: 50%;
		margin			: -25px 0 0 0;
		padding			: 0;
	}

	#indexSlider .slideshow .direction p.next { right : 0; }
	#indexSlider .slideshow .direction p.prev { left  : 0; }


	#indexSlider .slideshow .direction p a {
		display			: block;
		width			: 20px;
		height			: 50px;
		background-color	: rgba(0,0,0,0.5);
		background-position	: center center;
		background-repeat	: no-repeat;
		text-align			: left;
		text-indent			: -9999px;
		overflow			: hidden;
	}
	#indexSlider .slideshow .direction p.next a { background-image:url(img/right.png); }
	#indexSlider .slideshow .direction p.prev a { background-image:url(img/left.png); }



/* -------------------------------------------------------------------
	Index News
---------------------------------------------------------------------- */



	#indexNews {
		margin			: 70px 10% 0;
	}

	#indexNews > #news {
		display			: block;
		position		: relative;
		margin			: 0 220px 0 0;
		padding			: 0;
	}

	#indexNews > #news > header {
		margin			: 0;
		padding			: 0;
	}

	#indexNews > #news > header h1 {
		margin			: 0;
		padding			: 0;

		font-family		: 'Helvetica LT W01 Bold','Helvetica Bold', 'Ariel', Sans-serif,'AxisStd-Regular';
/*
		font-family		: 'DIN_1451 LT W01 Engschrift', 'DIN_1451 LT W01 Mittelschrift', 'Helvetica', 'Ariel', Sans-serif,'AxisStd-Regular';
*/
		font-size		: 12pt;
		font-weight		: normal;
		line-height		: 1;
	}

	#indexNews > #news .list {
		width			: auto;
		height			: 270px;
		margin			: 20px 0 0 0;
		padding			: 0;
		overflow		: auto;
		overflow-x		: hidden;
		overflow-y		: auto;
	}

	#indexNews > #news .list dl {
		margin			: 0 10px 0 0;
		padding			: 0;
	}

	#indexNews > #news .list dl dt {
		margin			: 0;
		padding			: 20px 0 0 0;
/*		font-family		: 'DIN_1451 LT W01 Mittelschrift', 'Helvetica', 'Ariel', Sans-serif,'AxisStd-Regular'; */
		font-family		: 'Helvetica LT W01 Roman', 'Helvetica', 'Ariel', Sans-serif,'AxisStd-Regular';
		font-size		: 12pt;
		font-weight		: normal;
	}

	#indexNews > #news .list dl dt img {
		float			: right;
		margin			: 0 0 0 10px;
		width			: auto;
		max-width		: 15%;
		height			: auto;
	}

	#indexNews > #news .list dl dd {
		margin			: 0;
		padding			: 0 0 5px;
		border-bottom	: 1px dashed #000000;
	}
	#indexNews > #news .list dl dd:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

	#indexNews > #news .list dl dd p{
		margin			: 0;
	}


	#indexNews .right {
		display			: block;
		position		: absolute;
		right			: 0;
		top				: 0;
		width			: 200px;
		margin			: 0;
		padding			: 35px 0 0 0;
	}


	/* メルマガ登録 ---------------------------------------- */

	#indexNews #mailmag {
		display			: block;
		position		: relative;
		margin			: 0;
		padding			: 0;
		background		: #a6b9c4;
	}

	#indexNews #mailmag > header {
		margin			: 0;
		padding			: 25px 0 0 0;
	}

	#indexNews #mailmag > header h1 {
		margin			: 0 15px;
		padding			: 0;
		text-align		: center;
	}

	#indexNews #mailmag > header h1 img {
		vertical-align	: bottom;
	}

	#indexNews #mailmag form {
		display			: block;
		margin			: 10px 15px 0 15px;
		padding			: 0;
	}

	#indexNews #mailmag form dl {
		margin			: 0;
		padding			: 0;
	}

	#indexNews #mailmag form dl dt {
		margin			: 0;
		padding			: 0;
	}

	#indexNews #mailmag form dl dd {
		margin			: 0;
		padding			: 10px 0;
	}

	#indexNews #mailmag input[type="email"] {
		display			: block;
		width			: 100%;
		height			: 30px;
		line-height		: 30px;
		margin			: 0;
		padding			: 0 5px;
		border			: 0;
		background		: #ffffff;
		-webkit-appearance	: none;
		border-radius		: 0;
		box-sizing		: border-box;
	}
	#indexNews #mailmag input[type="email"]::-webkit-input-placeholder { color: #ccc; }
	#indexNews #mailmag input[type="email"]:-ms-input-placeholder      { color: #ccc; }
	#indexNews #mailmag input[type="email"]::-moz-placeholder          { color: #ccc; }


	#indexNews #mailmag input[type="submit"] {
		display			: block;
		width			: 100%;
		height			: 35px;
		margin			: 0;
		padding			: 0;
		cursor			: pointer;

		border			: 0;
		border-radius	: 0;

		overflow		: hidden;
		text-indent		: -9999px;
		text-align		: left;

		background-image	: url(img/index/mailmag_enter.png);
		background-position	: 0 center;
		background-repeat	: no-repeat;
		background-color	: transparent;

		-webkit-appearance	: none;
		box-sizing		: border-box;
	}

	#indexNews #mailmag .powered {
		display			: block;
		position		: absolute;
		width			: 100%;
		left			: 0;
		bottom			: -15px;
		margin			: 0;
		padding			: 0;
		font-size		: 8pt;
		text-align		: center;
	}



	/* ブログ ---------------------------------------------- */

	#indexNews #blog {
		display			: block;
		position		: relative;
		margin			: 30px 0 0 0;
		padding			: 0;
	}

	#indexNews #blog > header {
		display			: none;
	}

	#indexNews #blog .banner a {
		display			: block;
		margin			: 0;
		padding			: 5px 0;
		border			: 1px solid #e0e0e0;
		text-align		: center;
	}

	#indexNews #blog .banner a img {
		width			: 90%;
	}



/* -------------------------------------------------------------------
	Index Food Block
---------------------------------------------------------------------- */



	#indexFood {
		margin			: 150px 0 0 0;
	}

	#indexFood > header {
		display			: block;
		position		: relative;
		margin			: 0;
		padding			: 0;
		border-top		: 1px solid #000;
	}

	#indexFood > header > h1 {
		display			: block;
		position		: absolute;
		width			: 100%;
		height			: 40px;
		line-height		: 40px;
		left			: 0;
		top				: -21px;
		margin			: 0;
		padding			: 0;
		text-align		: center;

		font-family		: 'AlternateGothicW01-No3_691802', 'DIN_1451 LT W01 Engschrift','Helvetica', 'Ariel', Sans-serif;
		font-size		: 20pt;
		font-weight		: normal;
	}


	#indexFood > header > h1 span {
		padding			: 0 20px;
		background		: #ffffff;
		border			: 1px solid #000;
	}


	#indexFood .sections {
		display			: block;
		position		: relative;
		margin			: 65px 0 0 0;
		padding			: 0;
	}
	#indexFood .sections:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }



	/* 各店舗 ---------------------------------------------- */

	#indexFood section {
		display			: block;
		position		: relative;
		float			: left;
		width			: 31.33%;
		margin			: 0 1%;
		padding			: 0;

		font-family		: 'Helvetica Neue LT W01_65 Md','Helvetica','Ariel','AxisStd-Regular',Meiryo,'Yu Gothic','Hiragino Kaku Gothic Pro',Osaka,'MS PGothic',Sans-serif;
	}

	#indexFood section ul,
	#indexFood section ul li,
	#indexFood section dl,
	#indexFood section dl dt,
	#indexFood section dl dd {
		margin			: 0;
		padding			: 0;
		list-style-type	: none;
	}

	#indexFood section img {
		vertical-align	: bottom;
	}

	#indexFood section > header {
		height			: 100px;
		margin			: 0;
		padding			: 0;
	}

	#indexFood section > header h1 {
		text-align		: center;
		margin			: 0;
		padding			: 0;
	}
	#indexFood section#catering > header h1   { padding:10px 0 0 0; }

	#indexFood section dl {
		display				: block;
		position			: relative;
		width				: 100%;
		margin				: 0;
		padding				: 75% 0 0 0;
	}

	#indexFood section dl dt {
		display				: block;
		position			: absolute;
		top					: 0;
		left				: 0;
		width				: 100% !important;
		height				: 100% !important;
		margin				: 0;
		padding				: 0;
	}

	#indexFood section dl dt img {
		width				: 100% !important;
	}

	#indexFood section dl dd {
		display				: block;
		position			: absolute;
		top					: 0;
		left				: 0;
		width				: 100% !important;
		height				: 100% !important;
		margin				: 0;
		padding				: 0;
		background			: rgba(0,0,0,0.7);
		opacity				: 0;
		transition			: 0.5s;
	}
	#indexFood section dl:hover dd {
		opacity				: 1;
	}

	#indexFood section dl dd ul {
		display				: block;
		position			: absolute;
		width				: 50%;
		left				: 25%;
		top					: 50%;
		margin				: 0;
	}
	#indexFood section dl dd ul.site {
		margin				: -55px 0 0 0;
	}

	#indexFood section dl dd ul.site li a {
		display				: block;
		height				: 50px;
		background			: url(img/index/site_icon.png) center center no-repeat;
		overflow			: hidden;
		text-indent			: -9999px;
	}

	#indexFood section dl dd ul.socials {
		margin				: 10px 0 0 0;
	}

	#indexFood section dl dd ul.socials li {
		float				: left;
		width				: 33.33%;
	}

	#indexFood section dl dd ul.socials li a {
		display				: block;
		width				: 100%;
		height				: 30px;
		background-position	: center center;
		background-repeat	: no-repeat;
		text-indent			: -9999px;;
		overflow			: hidden;

	}
	#indexFood section dl dd ul.socials li.twitter a {
		background-image	: url(img/twitter_s.png);
	}
	#indexFood section dl dd ul.socials li.facebook a {
		background-image	: url(img/facebook_s.png);
	}
	#indexFood section dl dd ul.socials li.instagram a {
		background-image	: url(img/instagram_s.png);
	}

	#indexFood section .catch {
		text-align			: center;
	}

	#indexFood section .catch strong {
		font-weight			: normal;
		font-size			: 13pt;
	}

	#indexFood section address {
		margin				: 1.5em 10px 0 10px;
		padding				: 0;
		font-family			:'Helvetica Neue LT W01_65 Md','Helvetica Neue LT W01_55 Roman','Helvetica','Ariel','AxisStd-Regular',Sans-serif;
		font-style			: normal;
		text-align			: center;
	}

	#indexFood section address ul li.tel{
		margin-bottom		: 1.5em;
	}



/* -------------------------------------------------------------------
	Index Online Block
---------------------------------------------------------------------- */



	#indexOnline {
		margin			: 130px 0 0 0;
	}



	/* Reset ------------------------------------- */

	#indexOnline ul,
	#indexOnline ul li,
	#indexOnline dl,
	#indexOnline dl dt,
	#indexOnline dl dd {
		margin			: 0;
		padding			: 0;
		list-style-type	: none;
	}

	#indexOnline a,
	#indexOnline a:visited { color:#231815; text-decoration:none; }
	#indexOnline a:hover   { color:#231815; text-decoration:underline; }


	/* Header ------------------------------------ */

	#indexOnline > header {
		display			: block;
		position		: relative;
		margin			: 0;
		padding			: 0;
		border-top		: 1px solid #000;
	}

	#indexOnline > header h1 {
		display			: block;
		position		: absolute;
		width			: 280px;
		left			: 50%;
		top				: -33px;
		margin			: 0 0 0 -140px;
		padding			: 10px 0;
		text-align		: center;
		background		: #ffffff;
	}

	#indexOnline > header h1 img {
		vertical-align	: bottom;
	}


	/* Category ---------------------------------- */

	#indexOnline nav {
		margin:120px 0 0;
		font-family:'Helvetica Neue LT W01_65 Md','Helvetica Neue LT W01_55 Roman','Helvetica','Ariel','AxisStd-Regular',Sans-serif;
	}

	#indexOnline nav ul {
		display:block;
		letter-spacing:-1em;
		text-align:center;
	}
	#indexOnline nav ul:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }


	#indexOnline nav ul li {
		display:inline-block;
		vertical-align:bottom;
		width:18%;
		margin:0 1%;
		text-align:center;
		letter-spacing:normal;
	}

	#indexOnline nav ul li img {
		width:auto;
		max-width:100%;
	}



/* -------------------------------------------------------------------
	Index Design Block
---------------------------------------------------------------------- */



	#indexDesign {
		margin			: 120px 0 0 0;
	}

	#indexDesign > header {
		display			: none;
	}



/* -------------------------------------------------------------------
	Apollo Block
--------------------------------------------------------------------- */



	#indexApollo {
		margin			: 120px 0 0 0;
	}


	/* Reset ------------------------------------- */

	#indexApollo ul,
	#indexApollo ul li,
	#indexApollo dl,
	#indexApollo dl dt,
	#indexApollo dl dd {
		margin			: 0;
		padding			: 0;
		list-style-type	: none;
	}


	/* Header ------------------------------------ */

	#indexApollo > header {
		display			: block;
		position		: relative;
		margin			: 0;
		padding			: 0;
		border-top		: 1px solid #000;
	}

	#indexApollo > header > h1 {
		display			: block;
		position		: absolute;
		width			: 100%;
		height			: 40px;
		line-height		: 40px;
		left			: 0;
		top				: -21px;
		margin			: 0;
		padding			: 0;
		text-align		: center;

/*		font-family		: 'DIN_1451 LT W01 Engschrift', 'DIN_1451 LT W01 Mittelschrift','AxisStd-Regular', Meiryo, 'Yu Gothic', 'Hiragino Kaku Gothic Pro', Osaka, 'MS PGothic','Helvetica', 'Ariel', Sans-serif; */
		font-family		: 'AlternateGothicW01-No3_691802', 'DIN_1451 LT W01 Engschrift','Helvetica', 'Ariel', Sans-serif;
		font-size		: 20pt;
		font-weight		: normal;
	}

	#indexApollo > header > h1 span {
		padding			: 0 20px;
		border			: 1px solid #000;
		background		: #ffffff;
	}

	#indexApollo nav {
		margin			: 45px 0 0 0;
	}

	#indexApollo nav ul{
	}
	#indexApollo nav ul:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

	#indexApollo nav ul li {
		display			: block;
		position		: relative;
		float			: left;
		width			: 50%;
	}

	#indexApollo nav ul li dl {
		display			: block;
		position		: relative;
		width			: 100%;
		margin			: 0;
		padding			: 64.2% 0 0 0;
	}

	#indexApollo nav ul li dl dt {
		display			: block;
		position		: absolute;
		top				: 0;
		left			: 0;
		width			: 100%;
		height			: 100%;
	}

	#indexApollo nav ul li dl dt img {
		width			: 100%;
	}

	#indexApollo nav ul li dl dd {
		display			: block;
		position		: absolute;
		top				: 0;
		left			: 0;
		width			: 100%;
		height			: 100%;
		box-sizing		: border-box;
		opacity			: 0;
		transition		: 0.5s;
	}
	#indexApollo nav ul li.apollo01 dl dd {
		background		: rgba(0, 134,180, 0.95);
	}
	#indexApollo nav ul li.apollo02 dl dd {
		background		: rgba(250,190,0, 0.95);
	}

	#indexApollo nav ul li dl:hover dd {
		opacity			: 1;
	}

	#indexApollo nav ul li dl dd a {
		display			: block;
		box-sizing		: border-box;
		width			: 100%;
		margin			: 0;
		padding			: 15% 5% 60px;
		color			: #ffffff;
		text-decoration	: none;
		text-align		: center;
		background		: url(img/index/site_icon.png) center bottom no-repeat;
	}



