/*-- common.css --*/
@charset "UTF-8";
/*----------------------
## import ##
----------------------*/
@import "/common/css/html5reset-1.6.1.css";
/*-- @import url('https://fonts.googleapis.com/css?family=Chivo:400,900'); --*/

/*----------------------
## behavior settings ##
----------------------*/
body {
	font-family: "Hiragino Kaku Gothic Pro",HiraKakuPro-W3,"ヒラギノ角ゴ Pro W3","メイリオ", Meiryo,"MS P ゴシック",verdana,sans-serif;
	font-size: 12px;
	text-align: center;
	margin:0;
	padding:0;
	line-height:1.8;
	/*letter-spacing:1px;*/
	color: #333;
}
html, body, #wrapper {
	height: 100%;
}
body > #wrapper {
	height: auto;
	min-height: 100%;
}

a {
	color: #666;
	text-decoration: none;
}
a:hover {
	text-decoration: none;
	opacity: 0.75;
}


/*----------------------
## global settings ##
----------------------*/
#wrapper {
	position: relative;
	margin: 0 auto;
	width: 1000px;
	text-align: left;
}
#wrapper #container {
	padding-bottom: 100px;
	z-index: 1;
}

/*---------
## header ##
----------*/
#wrapper #container header {
	position: relative;
	height: 160px;
	width: 100%;
	margin-bottom: 10px;
	background-color: #fff;
	z-index: 10;
}
#wrapper #container header h1 {
	position: absolute;
	top: 0;
	left: 0;
	height: 120px;
	width: 120px;
	z-index: 12;
}
#wrapper #container header h1 a {
	display: block;
	height: 120px;
	width: 120px;
	background-image: url("/common/images/logo_hdr.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}
#wrapper #container header h1 a span {display: none}

#wrapper #container header div.headerWrap {
	position: relative;
	width: 100%;
	height: 120px;
	background-image: url("/common/images/bg_hdr.jpg");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: contain;
}
#wrapper #container header div.headerWrap h2 {display: none}
#wrapper #container header div.headerWrap p.archive {
	position: absolute;
	top: 15px;
	right: 10px;
	width: 200px;
	height: 40px;
	border-radius: 10px;
	overflow: hidden;
}
#wrapper #container header div.headerWrap p.archive a {
	display: block;
	width: 200px;
	height: 40px;
	background-image: url("/common/images/bnr_backnumber.png");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: contain;
}
#wrapper #container header div.headerWrap p.archive a span {display:none}
#wrapper #container header nav {
	position: absolute;
	top: 120px;
	left: 0;
	width: 100%;
	height: 40px;
}
#wrapper #container header nav ul {
	display: table;
	width: 100%;
	border-collapse: separate;
	border-spacing: 1px;
}
#wrapper #container header nav ul li {
	display: table-cell;
	text-align: center;
	width: 20%;
	height: 40px;
	line-height: 40px;
	margin: 1px;
}
#wrapper #container header nav ul li a {
	display: block;
	color: #fff;
	width: auto;
	height: 40px;
	font-size: 1.4em;
	background: #ff8c7f; /* Old browsers */
	background: -moz-linear-gradient(top,  #ff8c7f 0%, #ff1a00 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff8c7f), color-stop(100%,#ff1a00)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ff8c7f 0%,#ff1a00 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ff8c7f 0%,#ff1a00 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ff8c7f 0%,#ff1a00 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ff8c7f 0%,#ff1a00 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff8c7f', endColorstr='#ff1a00',GradientType=0 ); /* IE6-9 */
}


/*-----------------
## main container ##
------------------*/
#wrapper #container div#main {
	margin-bottom: 20px;
}

#wrapper #container div#main > .left {
	float: left;
	width: 230px;
}
div#main > .left ul.banners {
	margin-bottom: 10px;
}
div#main > .left ul.banners li {
	margin-bottom: 5px;
	width: 100%;
	height: auto;
}
div#main > .left ul.banners li a {
	display: block;
	width: 100%;
	background-repeat: no-repeat;
	background-position: right center;
	background-size: contain;
}
div#main > .left ul.banners li.visa a {
	height: 80px;
	background-image: url("/common/images/bnr_visa.jpg");
}
div#main > .left ul.banners li.whenever a {
	height: 80px;
	background-image: url("/common/images/bnr_whenever_beijing.jpg");
}
div#main > .left ul.banners li.blog a {
	height: 68px;
	background-image: url("/common/images/bnr_blog.jpg");
}
div#main > .left ul.banners li.weixin a {
	height: 110px;
	background-image: url("/common/images/bnr_weixin.jpg");
}
div#main > .left ul.banners li.his_shanghai a {
	height: 100px;
	background-image: url("/common/images/bnr_hisshanghai.jpg");
}

div#main > .left ul.banners li a span {display: none}

div#main > .left section.info {
	margin-bottom: 10px
}
div#main > .left section.info h2 {
	height: 40px;
	line-height: 40px;
	margin-bottom: 5px;
	text-align: center;
	border-top: 2px solid #039;
	border-bottom: 2px solid #039;
}
div#main > .left section.info h2 span {
	color: #039;
	font-size: 2em;
}
div#main > .left section.info > p {
	text-align: center;
	margin-bottom: 5px;
	color: #f30;
	font-weight: bold;
}
div#main > .left section.info > ul {
	/*list-style: disc inside;*/
	padding: 0.25em;
	margin-bottom: 5px;
	background-color: #f3f3f3;
}
div#main > .left section.info > ul li {
	/*list-style: disc inside;*/
}
div#main > .left section.info div.map {
	box-sizing: border-box;
	width: 100%;
	height: 200px;
	background-color: #efefef;
	border: 1px solid #ccc;
}
div#main > .left section.info > ul li.mail {
	clear: both;
	text-align: center;
}
div#main > .left section.info > ul li.mail a {color:#c00;}
div#main > .left section.info > ul li.open {
	display: block;
}
div#main > .left section.info > ul li.open span {
	float: left;
	width: 30%;
}
div#main > .left section.info > ul li.open i {
	float: right;
	width: 70%;
	font-style: normal;
}




div#main > .left section.info address {
	text-align: center;
	font-style: normal;
	white-space: nowrap;
}
div#main > .left section.info address.address {
	padding: 5px;
	border: 1px solid #ccc;
	margin-bottom: 10px;
	font-weight: bold;
	color: #039;
}

div#main > .left section.info address em {
	font-weight: bold;
	font-size: 2em;
	font-style: normal;
	letter-spacing: -0.1em;
	color: #060;
}


/*-- Center --*/
#wrapper #container div#main > .center {
	float: right;
	width: 760px;
}

#wrapper #container div#main > .center ol.breadCrumbs {
	margin: 0;
	padding: 5px 10px;
	margin-bottom: 10px;
	background-color: #e3e3e3;
}
#wrapper #container div#main > .center ol.breadCrumbs li {
	display: inline;
	padding-right: 0.5em;
}
#wrapper #container div#main > .center ol.breadCrumbs li:after {
	content: ">";
	padding-left: 0.5em;
}
#wrapper #container div#main > .center ol.breadCrumbs li:last-child:after {
	content: " ";
	padding: 0;
}

#wrapper #container div#main > .center .block {
	position: relative;
	margin-bottom: 20px;
}
#wrapper #container div#main > .center .centerBanner {
	height: 428px;
	background: url("/common/images/center_banner_preload.gif") center center no-repeat;
}

#wrapper #container div#main > .center .block h2 {
	color: #fff;
	font-size: 1.4em;
	font-weight: normal;
	line-height: 40px;
	letter-spacing: .6em;
	margin-bottom: 10px;
	background: #f85032; /* Old browsers */
	background: -moz-linear-gradient(top,  #f85032 0%, #f16f5c 50%, #f6290c 51%, #f02f17 71%, #e73827 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f85032), color-stop(50%,#f16f5c), color-stop(51%,#f6290c), color-stop(71%,#f02f17), color-stop(100%,#e73827)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f85032', endColorstr='#e73827',GradientType=0 ); /* IE6-9 */
}
#wrapper #container div#main > .center .block h2 span {
	padding: 0 20px;
}

.center > h1 {
	color: #ff1a00;
	font-size: 1.4em;
	font-weight: bold;
	line-height: 36px;
	letter-spacing: .3em;
	padding: 5px 20px;
	margin-bottom: 10px;
	border: 2px solid #ff1a00;
}



/*-- inquiry button --*/
article p.btn {
	text-align: right;
	margin-bottom: 10px;
}
article p.btn a {
	display: inline-block;
	padding: 0.5em 2em;
	font-size: 1.4em;
	color: #fff;
	border-radius: 6px;
	background-color: #c00;
}
article p.btn a:hover {
	text-decoration: none;
	opacity: 0.75;
}

article p.btn a span {
	padding-left: 40px;
	background: url("/common/images/ico_inquiry.png") left center no-repeat;
}

/*---------
## return ##
---------*/
body > p.return {
	display: none;
	position: fixed;
	bottom: 10px;
	right: 10px;
	width: 60px;
	height: 60px;
	z-index: 100;
}
body > p.return a {
	display: block;
	width: 60px;
	height: 60px;
	background-image: url("/common/images/btn_return.png");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}
body > p.return a span {display:none}

/*----------
## footer ##
----------*/
footer {
	clear: both;
	position: relative;
	height: 100px;
	width: 100%;
	margin-top: -100px;
	overflow: hidden;
	border-top: 2px solid #039;
}
footer div#footerWrap {
	position: relative;
	display: block;
	box-sizing: border-box;
	margin: 0 auto;
	padding: 20px 0;
	width: 1000px;
	height: 100px;
	text-align: left;
}
footer div#footerWrap section.footerLeft {
	position: relative;
	float: left;
	width: 50%;	
}
footer div#footerWrap section.footerLeft h2 {
	position: absolute;
	left: 0;
	right: 0;
	width: 100px;
	height:50px;
	background-image: url("/common/images/logo_fot.png");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: contain;
}
footer div#footerWrap section.footerLeft h2 span {display: none}

footer div#footerWrap section.footerLeft section.leftInner {
	padding-left: 120px;
}
footer div#footerWrap section.footerLeft section.leftInner h3 {
	font-size: 1.1em;
	color: #039;
}

footer div#footerWrap section.footerLeft section.leftInner ul {}
footer div#footerWrap section.footerLeft section.leftInner ul li {
	display: inline;
	padding-right: 1em;
}
footer div#footerWrap section.footerLeft section.leftInner ul li a {
	color: #039;
}
footer div#footerWrap section.footerLeft section.leftInner ul li a:before {
	content: url("/common/images/ico_arrow_right_02.png");
	padding-right: .5em;	
}

footer div#footerWrap div.footerRight {
	float: right;
	width: 50%;
	text-align: right;
}
footer div#footerWrap div.footerRight p {
	display: inline-block;
	padding: 0 .5em;
	vertical-align: top;
}
footer div#footerWrap div.footerRight p a {
	display: block;
	height: 48px;
	line-height: 48px;
}
footer div#footerWrap div.footerRight p a span {display: none}

footer div#footerWrap div.footerRight p.sgs a {
	width: 48px;
	height: 48px;
	background-image: url("/common/images/ico_fot_sgs.gif");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}

/*----------------------------
## As you may know Clearfix ##
----------------------------*/
.clear {
	clear: both;
}

.clearfix:after {
	content: ".";   
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	overflow:hidden;
	font-size:0.1em;
	line-height:0;
}
.clearfix { display: inline-table; }
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */