@charset "utf-8";

/* 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, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table.table, caption, tbody, tfoot, thead, tr, th, td {border: 0;font-family: inherit;font-size: 100%;font-style: inherit;font-weight: inherit;margin: 0;outline: 0;padding: 0;vertical-align: baseline;}
:focus {outline: 0; margin: 0px; padding: 0px;}

ol, ul, li {list-style: none;}
table {border-collapse: collapse; border-spacing: 0;}
caption, th, td {font-weight: normal;text-align: left;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img{border: 0;}
figure{margin:0}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}

* html body{overflow: hidden;}
body {
	font-family:"¥Ò¥é¥®¥Î½Ç¥´ Pro W3", "Hiragino Kaku Gothic Pro", "¥á¥¤¥ê¥ª", Meiryo, Osaka, "£Í£Ó £Ð¥´¥·¥Ã¥¯", "MS PGothic", sans-serif;
	font-size: 62.5%; /*1em = 10px*/
	line-height: 140%;
	color:#333;
	background-color:#fff;
	-webkit-text-size-adjust:100%;
}
img {border:none; width:auto; height: auto; max-width:100%;}

.clearfix:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}
.clearfix {min-height: 1px;}

* html .clearfix {
  height: 1px;
  /*?*//*/
  height: auto;
  overflow: hidden;
  /**/
}

p {font-size: 1.2em; color: #333;}

a {outline: medium none;}
a:link {color: #333; text-decoration: none;}
a:visited {color: #333; text-decoration: none;}
a:hover {color: #00a3d9; text-decoration: underline;}
img {vertical-align: bottom;}
a img {border: none;}
a:hover img {
	opacity:0.7;
	filter:alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
	background-color: transparent;
}

.left {float:left;}
.right {float:right;}

.pc {display: none;}
.sp {display: block;}

/*----- container -----------------------------------*/
body .container {
	margin: 0 2% 15px;
	width: 96%;
	height: auto;
}
body .container:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}
.wrap, .inner {margin: 0 auto; width:100%; height: auto;}
.wrap:after, .inner:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}

/*----- header -----------------------------------*/
header {
	width: 100%;
	height: auto;
}
header .inner {padding: 0;}
header .siteTitle {
	margin: 1.2em 0 0 10px;
	width: 60%;
	height: auto;
	float:left;
}

.subnav {
	padding: 5px 0 0 0;
	width: 100%;
	text-align: center;
	background: #fff;
	position: absolute;
	top: -500px;
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	z-index: 900;
}
.subnav ul {
	position: static;
	right: 0;
	bottom: 0;
	font-size: 1.2em;
}
.subnav ul:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}
.subnav ul li {
	float: none;
	position: static;
	padding: 0.5em 0;
	border-bottom:1px dotted #a7a7a7;
}
.subnav ul li:first-child {
	border-top:1px dotted #a7a7a7;
}
#top-head .subnav ul li a,
#top-head.fixed .subnav ul li a {
	width: 100%;
	display: block;
}
#top-head.fixed {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background: #ffffff;
}
#top-head {
	z-index: 990;
	border-bottom:1px solid #a7a7a7;
}

/* Toggle Button */
#mobile-head {
	width: 100%;
	height: 60px;
	z-index: 999;
	position: relative;
}
#mobile-head:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}

#nav-toggle {
	display: block;
	position: absolute;
	right: 12px;
	top: 12px;
	width: 36px;
	height: 40px;
	cursor: pointer;
	z-index: 101;
}
#nav-toggle div {position: relative;}
#nav-toggle span, 
#nav-toggle p {
	display: block;
	position: absolute;
	height: 4px;
	width: 100%;
	background: #666;
	left: 0;
	-webkit-transition: .35s ease-in-out;
	-moz-transition: .35s ease-in-out;
	transition: .35s ease-in-out;
}
#nav-toggle span:nth-child(1) {top: 0;}
#nav-toggle span:nth-child(2) {top: 10px;}
#nav-toggle span:nth-child(3) {top: 20px;}
#nav-toggle p {
	top: 28px;
	height: auto;
	font-size:0.6em;
	line-height:1.2em;
	text-align:center;
	background: transparent;
}

/* #nav-toggle == Change == */
.open #nav-toggle span:nth-child(1) {
	top: 10px;
	-webkit-transform: rotate(315deg);
	-moz-transform: rotate(315deg);
	transform: rotate(315deg);
}
.open #nav-toggle span:nth-child(2) {
	width: 0;
	left: 50%;
}
.open #nav-toggle span:nth-child(3) {
	top: 10px;
	-webkit-transform: rotate(-315deg);
	-moz-transform: rotate(-315deg);
	transform: rotate(-315deg);
}
/* .subnav ==Slide== */
.open .subnav {
	/* .subnav top + #mobile-head height */
	-moz-transform: translateY(556px);
	-webkit-transform: translateY(556px);
	transform: translateY(556px);
}

/*----- navigation -----------------------------------*/
nav {
	width: 100%;
	height: auto;
}
nav ul {
	margin: 0 auto;
	width:100%;
	height: auto;
}
nav ul li {
	width:20%;
	line-height: 1;
	float:left;
}
nav ul:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}


/*----- sideNav a.k.a Circle Menu -----------------------------------*/
.sideNav {
	margin: 0 auto;
	width: 96%;
	height: auto;
}
.sideNav ul {
	width:100%;
	height: auto;
}
.sideNav ul:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}
.sideNav ul li {
	margin: 0 1% 0;
	width:23%;
	line-height: 1;
	float:left;
}
.sideNav ul li:last-child {}


/*----- footer -----------------------------------*/
footer {
	padding: 15px 0 0 0;
	width: 100%;
}
footer dl, footer dt, footer dd {
	width: 100%;
	height:auto;
}
footer dl {
	margin: 0 2% 30px;
	width: 96%;
	border-top:1px dotted #aaaaaa;
	border-bottom:1px dotted #aaaaaa;
	background: url(/tokyo/common/images/footer_fig.jpg) no-repeat right bottom;
	background-size: 20%;
}
footer dt {
	padding: 10px 0;
	width: 70%;
}
footer dd {
	width: 100%;
	height:auto;
	border-top:1px dotted #aaaaaa;
}
footer dd:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}

footer p {
	font-size: 1.2em;
	line-height: 1.6em;
	text-align:left;
}
footer dd .information, 
footer dd .businessHours {
	margin: 0 0 1em 0;
	padding: 0;
	width: 100%;
	height:auto;
	font-size: 1.2em;
	line-height: 1.6em;
	text-align:left;
	font-weight: bold;
}
footer dd .information {margin-top: 1em;}
footer dd .information a:link {color: #333; text-decoration: none;}
footer dd .information a:visited {color: #333; text-decoration: none;}
footer dd .information a:hover {color: #00a3d9; text-decoration: underline;}
/*
footer dd .businessHours .hour {
	margin: 0 0 0.8em 0;
	font-size: 1.16em;
	font-weight: bold;
	vertical-align: text-top;
}
footer dd .businessHours .hour span {
	margin: 0 1em 0 0;
	padding: 2px 6px 1px;
	font-size: 0.83em;
	color: #fff;
	font-weight: normal;
	background-color: #000;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
*/
footer dd .businessHours dl {
	margin: 0 0 0.8em 0;
	width: 100%;
	border-style:none;
	background-image:none;
	font-size: 1.16em;
	font-weight: bold;
	vertical-align: text-top;
}
footer dd .businessHours dl:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}
footer dd .businessHours dt {
	margin: 0;
	padding: 0;
/*	width: 23%; rep 2017.07.07 */
	width: 28%;
	float:left;
}
footer dd .businessHours dd {
/*	width: 77%; rep 2017.07.07 */
	width: 72%;
	height:auto;
	border-style:none;
	float:left;
}
/* del 2017.07.07
footer dd .businessHours dt span {
	margin: 0 1em 0 0;
	padding: 2px 6px 1px;
	font-size: 0.83em;
	color: #fff;
	font-weight: normal;
	background-color: #000;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
*/
/* add 2017.07.07 */
/* é_ÊÒÆÚég */
footer dd .businessHours dt span.dt-font1 {
	margin: 0 1em 0 0.9em;
	padding: 2px 10px; 
	font-size: 0.83em;
	color: #fff;
	font-weight: normal;
	background-color: #000;
}
/* (ÖvÁxÆÚégÖÐ) */
footer dd .businessHours dt span.dt-font2 {
	margin: 0;
	padding: 3px 10px;
	font-size: 0.83em;
	color: #333;
	font-weight: normal;
	background-color: #fff;
}
/* add end */

.pagetop{
	margin-left: 80%;
	width: 15%;
	height: auto;
	cursor:pointer;
}

footer .linkOther {
	margin:0 0 1em 0;
	width: 100%;
	height: auto;
	background: url(/tokyo/common/images/tri01.png) repeat-x 0 bottom;
	background-size: contain;
	background-color: #c10e23;
}

footer .linkOther ul {
	margin:0 2%;
	padding: 10px 0 0 0;
	width: 98%;
}
footer .linkOther li {
	margin:0 2em 0 0;
	padding:0 0 0 1em;
	width: auto;
	font-size: 1.2em;
	line-height: 1.2em;
	color:#ffffff;
	font-weight: normal;
	background: url(/tokyo/common/images/arrow_white.png) no-repeat 0 center;
	float:left;
}
footer .linkOther li a {color:#ffffff;}
footer .linkOther ul:after {content: ".";display: block;clear: both;height: 0;visibility: hidden;}

footer .linkOther .copyright {
	margin:0 2%;
	padding: 5px 0 15px 0;
	width: 96%;
	font-size: 1em;
	line-height: 1.2em;
	color:#ffffff;
	font-weight: normal;
	text-align:right;
}


/*===============================================
= More than 641px 
= Except for Smart Phone
===============================================*/
@media screen and (min-width: 641px) {

	.pc {display: block;}
	.sp {display: none;}

	/*----- container -----------------------------------*/
	body .container {
		padding: 120px 0 0 0;
		margin: 0 auto;
		width: 100%;
	}
	.inner {margin: 0 auto; width:960px;height: auto;}
	
	/*----- header -----------------------------------*/
	header {
		margin: 0 auto;
		height: 120px;
		min-width: 960px;
	}
	header .inner {padding: 20px 0;}

	.subnav {
		padding:0;
		width:100%;
		height: 20px;
		background: #c10e23;
		position: relative;
		top: 0;
	}
	.subnav ul {position: relative;
		margin:0 auto;
		width: 960px;
		height: 20px;
	}
	.subnav ul li {
		float:right;
		position: relative;
		border-bottom:none;
		margin:0 1em 0 0;
		padding:0 1em 0 0;
		border-right:1px solid #d14a5a;
	}
	.subnav ul li:first-child {
		margin:0;
		padding:0;
		border-right:none;
	}
	#top-head .subnav ul li a {
		width: auto;
		color: #fff;
		line-height: 20px;
		font-weight:normal;
		text-align:left;
	}
	#top-head {
		width: 100%;
		background: #ffffff;
		z-index: 990;
		border-bottom:1px solid #a7a7a7;
		position: fixed !important;  
		position: absolute;  
		top: 0;  
		left: 0; 
	}
	header .siteTitle {
		margin: 0;
		width: 335px;
		height: 60px;
		float:left;
	}
	#mobile-head {width: 960px;}

	/* Toggle Button */
	#nav-toggle {
		display: none;
		position: absolute;
		right: 12px;
		top: 14px;
		width: 34px;
		height: 36px;
		cursor: pointer;
		z-index: 101;
	}
	
	/*----- navigation -----------------------------------*/
	nav {
		width: 550px;
		height: 60px;
		float:right;
	}
	nav ul {
		margin: 0 0 0 14px;
		width:536px;
		height: 60px;
	}
	nav ul li {width:106px;border-right:1px solid #cccccc;}
	nav ul li:first-child {border-left:1px solid #cccccc;}
	
	
	/*----- sideNav a.k.a Circle Menu -----------------------------------*/
	.sideNav {width: 890px;}
	.sideNav ul li {
		margin: 0 30px 0 0;
		width:200px;
	}
	.sideNav ul li:last-child {margin-right: 0;}

	img.grow {
		-webkit-transition:0.2s ease-in-out;
		-moz-transition:0.2s ease-in-out;
		-ms-transition:0.2s ease-in-out;
		-o-transition:0.2s ease-in-out;
		transition:0.2s ease-in-out;
	}
	img.grow:hover {
		-webkit-transform:scale(1.1,1.1);
		-moz-transform:scale(1.1,1.1);
		-ms-transform:scale(1.1,1.1);
		-o-transform:scale(1.1,1.1);
		transform:scale(1.1,1.1);
	}


	/*----- footer -----------------------------------*/
	footer {
		margin: 0 auto;
		padding: 55px 0 0 0;
		width: 100%;
		min-width: 960px;
	}
	footer dl {
		margin: 0 auto 30px;
		width: 960px;
		background: url(/tokyo/common/images/footer_fig.jpg) no-repeat right bottom;
	}
	footer dt {
		padding: 13px 15px;
		width: 100%;
	}
	footer dd {width: 732px;}
	footer dd .information, 
	footer dd .businessHours {
		margin: 0 0 1em 15px;
		padding: 13px 0;
		width: 350px;
		height:auto;
		float:left;
	}
	footer dd .information {
		border-right:1px dotted #aaaaaa;
	}

	.pagetop{
		margin-left: 898px;
		width: 62px;
		height: 30px;
		cursor:pointer;
	}

	footer .linkOther {
		margin:0 auto 1em;
		width: 100%;
		height: 50px;
		background: url(/tokyo/common/images/tri01.png) repeat-x 0 bottom;
		background-color: #c10e23;
		min-width: 960px;
	}

	footer .linkOther ul {
		margin:0 ;
		padding: 15px 0 0 0;
		width: 350px;
		float:left;
	}
	footer .linkOther .copyright {
		margin:0 ;
		padding: 15px 0 0 0;
		width: 350px;
		float:right;
	}
	
}