@charset "utf-8";

#body {width:100%;}
	
	#image {}
	#image > ul {width:100%; position:relative;}
	#image > ul > li {width:100%; position:absolute; left:0; top:0; z-index:1;}
	#image > ul > li:first-child {position:relative;}
	#image > ul > li.selected {position:relative; z-index:2;}
	#image > ul > li > img {width:100%; height:auto;}
	#image > nav {display:none;}
	
	#theme {*zoom:1; position:relative; padding:53px 0; background:#978e8a; overflow:hidden;}
	#theme > h1 {
		width:112px; height:37px; margin:0 auto; background:url(images/theme_title.png) no-repeat; font-size:24px; text-indent:-9999px;}
	#theme > ul {width:100%;}
	#theme > ul:after {display:block; clear:both; height:0; content:"";}
	#theme > ul > li {float:left; width:100%; height:350px; margin:20px auto 0; background:center 0 no-repeat;}
	#theme > ul > li > hgroup {display:none;}
	#theme > ul > li > hgroup > h1 {font-size:48px; text-align:center;}
	#theme > ul > li > hgroup > h2 {font-size:24px; text-align:center;}
	#theme > ul > li > p {display:none; font-size:14px; text-align:center;}
	#theme > ul > li > p br {display:none;}
	#theme > ul > li > p > b {font-weight:bold;}
	#theme > ul > li.mission {background-image:url(images/theme_mission.png);}
	#theme > ul > li.vision  {background-image:url(images/theme_vision.png);}
	#theme > ul > li.value   {background-image:url(images/theme_value.png);}
	#theme > nav {width:100%; margin:65px 0 0; text-align:center;}
	#theme > nav > ul {display:inline-block; *display:inline; *zoom:1;}
	#theme > nav > ul > li {float:left;}
	#theme > nav > ul > li > a {
		display:block; width:20px; height:20px; background:url(images/slideshow_indicator.png) 0 0 no-repeat; text-align:left; text-indent:-9999px; overflow:hidden;}
	#theme > nav > ul > li > a:hover, 
	#theme > nav > ul > li.selected > a {background-position:-20px 0;}
	#theme > nav > .previous, 
	#theme > nav > .next     {display:block; width:87px; height:100%; position:absolute; top:0; background:center center no-repeat; text-indent:-9999px; overflow:hidden;}
	#theme > nav > .previous:hover, 
	#theme > nav > .next:hover     {opacity:0.5;}
	#theme > nav > .previous {left:50%;  margin:0 0 0 -500px; background-image:url(images/slideshow_previous.png);}
	#theme > nav > .next     {right:50%; margin:0 -500px 0 0;  background-image:url(images/slideshow_next.png);}

	#spacer {text-align:center;}
	#spacer > img {width:100%; height:auto;}
	
	#profile {padding:53px 0;}
	#profile > h1 {
		width:130px; height:37px; margin:0 auto; background:url(images/profile_title.png) no-repeat; font-size:24px; text-indent:-9999px;}
	#profile > ul {width:940px; padding:70px 0 0; position:relative; margin:0 auto;}
	#profile > ul > li {width:460px; margin:30px 0 0;}
	#profile > ul > li:after {display:block; clear:both; height:0; content:"";}
	#profile > ul > li > h2 {
		float:left; width:130px; height:29px; position:relative; left:-10px; top:-8px; background:no-repeat; font-size:12px; font-weight:bold; text-indent:-9999px;}
	#profile > ul > li > p, 
	#profile > ul > li > ul {float:right; width:310px; font-size:12px;}
	#profile > ul > li > p  {}
	#profile > ul > li > ul {}
	#profile > ul > li > ul > li {padding:0 0 0 1em; text-indent:-1em;}
	#profile > ul > li.name          > h2 {background-image:url(images/profile_name_title.png);}
	#profile > ul > li.office        > h2 {background-image:url(images/profile_office_title.png);}
	#profile > ul > li.established   > h2 {background-image:url(images/profile_established_title.png);}
	#profile > ul > li.capital-funds > h2 {background-image:url(images/profile_capital-funds_title.png);}
	#profile > ul > li.our-service {margin:0; padding:0 0 60px; position:absolute; right:0; top:100px;}
	#profile > ul > li.our-service   > h2 {background-image:url(images/profile_our-service_title.png);}
	#profile > ul > li.contact {position:absolute; right:0; bottom:0;}
	#profile > ul > li.contact > .btn_contact {
		display:block; width:178px; height:38px; border:1px solid #cccccc; background:url(images/profile_btn_contact-us.png) no-repeat; text-indent:-9999px; overflow:hidden;}
	#profile > ul > li.contact > .btn_contact:hover {opacity:0.5;}
	
	#access {margin:87px 0 0;}
	#access > .map {width:100%; height:600px;}

@media screen and (max-width:980px) {
	
	#image {}
	
	#theme {padding:35px 0; overflow:visible;}
	#theme > h1 {width:89px; height:25px; background-image:url(images/sp/theme_title.png); -webkit-background-size:contain; background-size:contain;}
	#theme > ul {width:auto; margin:0;}
	#theme > ul > li {float:none; width:auto; height:auto; margin:50px 25px 0; padding:30px 0 0; border-top:1px solid #000000; background:none;}
	#theme > ul > li:first-child {margin-top:0; border-top:none;}
	#theme > ul > li > hgroup {display:block; margin:0 -25px;}
	#theme > ul > li > hgroup > h1, 
	#theme > ul > li > hgroup > h2 {margin:0 auto; background:center 0 no-repeat; text-align:left; text-indent:-9999px; -webkit-background-size:contain; background-size:contain;}
	#theme > ul > li > hgroup > h1 {width:320px;}
	#theme > ul > li > hgroup > h2 {margin-top:35px;}
	#theme > ul > li > p {display:block; margin:35px 0 0; text-align:left;}
	#theme > ul > li > p br {}
	#theme > ul > li > p > b {display:block;}
	#theme > ul > li.mission, 
	#theme > ul > li.vision, 
	#theme > ul > li.value   {background:none;}
	#theme > ul > li.mission > hgroup > h1 {height:80px; background-image:url(images/sp/theme_mission_lead.png);}
	#theme > ul > li.mission > hgroup > h2 {width:94px; height:25px; background-image:url(images/sp/theme_mission_title.png);}
	#theme > ul > li.mission > p {}
	#theme > ul > li.vision  > hgroup > h1 {height:80px; background-image:url(images/sp/theme_vision_lead.png);}
	#theme > ul > li.vision  > hgroup > h2 {width:81px; height:25px; background-image:url(images/sp/theme_vision_title.png);}
	#theme > ul > li.vision  > p {}
	#theme > ul > li.value   > hgroup > h1 {height:40px; background-image:url(images/sp/theme_value_lead.png);}
	#theme > ul > li.value   > hgroup > h2 {width:76px; height:25px; background-image:url(images/sp/theme_value_title.png);}
	#theme > ul > li.value   > p {}
	#theme > nav {display:none;}
	
	#spacer {}
	
	#profile {padding:35px 24px 40px;}
	#profile > h1 {width:105px; height:25px; margin:0 auto; background-image:url(images/sp/profile_title.png); -webkit-background-size:contain; background-size:contain;}
	#profile > ul {width:auto; padding:0; position:relative; margin:0 auto;}
	#profile > ul > li {width:auto; margin:30px 0 0;}
	#profile > ul > li > h2 {float:none; width:auto; height:20px; left:-5px; top:0; font-size:14px; -webkit-background-size:contain; background-size:contain;}
	#profile > ul > li > p, 
	#profile > ul > li > ul {float:none; width:auto; font-size:14px;}
	#profile > ul > li > p  {}
	#profile > ul > li > ul {}
	#profile > ul > li > ul > li {padding:0 0 0 1em; text-indent:-1em;}
	#profile > ul > li.name          > h2 {width:54px; background-image:url(images/sp/profile_name_title.png);}
	#profile > ul > li.office        > h2 {width:66px; background-image:url(images/sp/profile_office_title.png);}
	#profile > ul > li.established   > h2 {width:115px; background-image:url(images/sp/profile_established_title.png);}
	#profile > ul > li.capital-funds > h2 {width:134px; background-image:url(images/sp/profile_capital-funds_title.png);}
	#profile > ul > li.our-service {margin:30px 0 0; padding:0; position:static;}
	#profile > ul > li.our-service   > h2 {width:115px; background-image:url(images/sp/profile_our-service_title.png);}
	#profile > ul > li.contact {position:static;}
	#profile > ul > li.contact > .btn_contact {
		width:182px; height:39px; margin:0 auto; background-image:url(images/sp/profile_btn_contact-us.png); -webkit-background-size:contain; background-size:contain;}
	
	#access {margin:0;}
	#access > .map {height:240px;}
	
}

@media screen and (max-width:360px) {
	
	#theme > ul > li > p br {display:block;}
	
}