@charset "utf-8";

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

ファーストオフィス スタイルシート

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


/* 共通
--------------------------------------------------------------------*/
body,div,p,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,td,th,form {
	margin:0;
	padding:0;
	font-style:normal;
	font-weight:normal;
	font-size:100%;
}
article,aside,figure,figcaption,footer,header,nav,section {
	display:block;
}
li {
	list-style-type:none;
}
table {
	border-collapse:collapse;
}
td,th {
	vertical-align:top;
}
th {
	text-align:left;
}
img {
	vertical-align:bottom;
}
a img {
	border:none;
}
body {
	font-family:"Lucida Grande", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, sans-serif;
	margin:0;
	text-align:center;
	font-size:80%;
	line-height:1.33;
	color:#646464;
}
.fs {
	font-size:85%;
}
.fl {
	font-size:125%;
}
.b {
	font-weight:bold;
}
.c {
	text-align:center;
}
.r {
	text-align:right;
}
a:link,
a:visited {
	color:#0096d2;
	text-decoration:none;
}
a:hover,
a:active {
	color:#0096d2;
	text-decoration:underline;
}
.cf:before,
.cf:after {
	content:"";
	display:table;
}
.cf:after {
	clear:both;
}
.cf {
	zoom:1;
	overflow:hidden;
}
.warning {
	color:#e61e1e;
	background-color:#fff;
	border:solid 1px #c8c8b4;
	padding:12px 15px 11px;
	margin-bottom:16px;
}

header {
	margin:0 auto;
	width:960px;
	padding-bottom:15px;
	text-align:left;
}
header .seo-area {
	padding:10px 0;
	font-size:85%;
	color:#969696;
}
header .seo-area h1 {
	float:left;
	width:600px;
}
header .seo-area .header-privacy {
	float:right;
	width:360px;
	text-align:right;
}
header h2 {
	float:left;
	width:550px;
	padding-top:5px;
}
header .header-tel {
	float:left;
	width:260px;
	padding-top:4px;
}
header .header-contact {
	float:left;
	width:150px;
}
header .header-contact .header-contact-last {
	padding-top:5px;
}
nav {
	background-color:#0096d2;
	text-align:left;
}
.tm {
	margin:0 auto;
	width:960px;
}
.tm li {
	float:left;
}
.main {
	margin:0 auto;
	width:960px;
	text-align:left;
	padding-bottom:70px;
}
#top .main {
	padding-top:20px;
}
.title-area {
	background-color:#78c8fa;
	text-align:center;
}
.top-navi {
	margin:0 auto;
	width:960px;
}
.top-navi p {
	padding:12px 0;
	text-align:right;
	font-size:85%;
}
.main-area .main-left {
	float:left;
	width:220px;
}
.lm {
	padding-bottom:25px;
}
.side-contact-area {
	border:solid 1px #f0f0f0;
	background-color:#fafafa;
	padding:14px;
}
.side-contact-area .side-address {
	padding-top:9px;
}
.side-contact-area .side-tel {
	padding:5px 0 1px;
	font-size: 85%;
	font-weight: bold;
}
.side-contact-area .side-tel2 {
	padding: 10px 0 1px;
	font-size: 85%;
	font-weight: bold;
}
.side-contact-area .side-tel-nom {
	font-weight: bold;
	font-size: 130%;
	color: #e61e1e;
}
.side-contact-area .side-tel-text {
	font-size: 85%;
	color: #323232;
}
.side-contact-area .side-contact {
	padding-top: 5px;
}
.side-contact-area .side-contact li {
	padding-top:5px;
}
.main-area .main-right {
	float:right;
	width:700px;
	padding-top:25px;
}
.main-area .main-right .top-page {
	padding-top:50px;
}
.main-area .main-right .top-page li {
	border-top:solid 1px #e1e1e1;
	padding-top:10px;
	text-align:right;
	font-weight:bold;
}
footer {
	background-color:#ebf0f5;
	padding:20px 0 15px
}
footer .bottom-link-area {
	margin:0 auto;
	width:960px;
	text-align:left;
}
footer .bottom-link-area .bottom-link {
	float:left;
	width:240px;
}
footer .bottom-link-area .bottom-link p {
	font-weight:bold;
	padding-bottom:4px;
	color:#0096d2;
}
footer .bottom-link-area .bottom-link li {
	padding:1px 0;
}
footer .bottom-link-area .bottom-link li a {
	color:#646464;
}
footer .copyright {
	font-size:85%;
	color:#969696;
	padding-top:20px;
	text-align:center;
}

.copy {
	padding-bottom:5px;
	font-weight:bold;
	font-size:125%;
	color:#0096d2;
}
.in {
	padding-left:10px;
}

/* トップ
--------------------------------------------------------------------*/
#top .slider-area {
	position:relative;
	width:100%;
	height:700px;
	overflow:hidden;
}
#top .slider-area-i {
	position:absolute;
	margin-left:-980px;
	left:50%;
}
#top .flex-control-nav {
	position:absolute;
	bottom:0;
	left:0;
}
#top .flex-control-paging li a {
	width:10px;
	height:10px;
	border-radius:0;
	background:#e1e1e1;
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	-o-box-shadow:none;
	box-shadow:none;
}
#top .flex-control-paging li a:hover {
	background:#00a050;
}
#top .flex-control-paging li a.flex-active {
	background:#00a050;
}
#top .top-main-area {
	padding-top:30px;
}
#top .top-main-area .top-main-left {
	float:left;
	width:700px;
}
#top .service-area {
	padding-top:15px;
}
#top .service-area .service-left {
	float:left;
	width:340px;
}
#top .service-area .service-right {
	float:right;
	width:340px;
}
#top .service-area li {
	float:left;
	width:170px;
	text-align:center;
	font-weight:bold;
}
#top .service-area li a {
	display:block;
	text-decoration:none;
	padding:12px 0 11px;
	color:#fff;
}
#top .service-area .service-left li.price a:link,
#top .service-area .service-left li.price a:visited {
	background-color:#0096d2;
}
#top .service-area .service-left li.price a:hover,
#top .service-area .service-left li.price a:active {
	background-color:#0078b4;
}
#top .service-area .service-left li.flow a:link,
#top .service-area .service-left li.flow a:visited {
	background-color:#78c8fa;
}
#top .service-area .service-left li.flow a:hover,
#top .service-area .service-left li.flow a:active {
	background-color:#64b4e6;
}
#top .service-area .service-right li.price a:link,
#top .service-area .service-right li.price a:visited {
	background-color:#32aa32;
}
#top .service-area .service-right li.price a:hover,
#top .service-area .service-right li.price a:active {
	background-color:#14961e;
}
#top .service-area .service-right li.flow a:link,
#top .service-area .service-right li.flow a:visited {
	background-color:#96be3c;
}
#top .service-area .service-right li.flow a:hover,
#top .service-area .service-right li.flow a:active {
	background-color:#78aa28;
}
#top h3.next {
	padding-top:50px;
}
#top .topics-area {
	padding:15px 0;
	border-top:dotted 1px #d2d2d2;
}
#top .topics-top {
	border-top:none !important;
}
#top .topics-area .photo {
	float:left;
	width:160px;
}
#top .topics-area .photo-r {
	float:right;
	width:520px;
}
#top .topics-area .photo-r img {
	vertical-align:middle;
	margin-right:10px;
}
#top .topics-area .photo-r h4 {
	padding:10px 0 5px;
	font-weight:bold;
	font-size:125%;
	color:#0096d2;
}
#top .topics-link {
	border-top:solid 1px #e1e1e1;
	padding-top:10px;
	font-weight:bold;
	text-align:right;
}
#top .top-main-area .top-main-right {
	float:right;
	width:220px;
}
#top .mypage-area {
    margin: 20px 0;
    border: solid 1px #ffead2;
    padding: 12px 0 10px;
    background-color: #fff4e8;
    text-align: center;
}
#top .mypage-area .login-text {
    padding-bottom: 7px;
    font-size: 140%;
    font-weight: bold;
    color: #ff961e;
}
#top .mypage-area .login-pass {
    padding-top: 13px;
    font-weight: bold;
}
#top .mypage-area .login-pass a {
    color: #ff961e;
}
#top h3.links {
	padding-bottom:10px;
}
#top h3.links img {
	display:block;
}
#top .banner-area {
	padding-bottom:5px;
}
#top .banner-area li {
	padding-bottom:15px;
}
#top .copy {
	padding-bottom:12px;
	font-weight:bold;
	font-size:125%;
	color:#00a050;
}
#top .links li {
	float:left;
	width:245px;
}

/* トピックス
--------------------------------------------------------------------*/
#topics .topics-area {
	padding:20px 0;
	border-bottom:dotted 1px #d2d2d2;
}
#topics .topics-area .photo {
	float:left;
	width:160px;
}
#topics .topics-area .photo-r {
	float:right;
	width:520px;
}
#topics .topics-area .photo-r img {
	vertical-align:middle;
	margin-right:10px;
}
#topics .topics-area .photo-r h4 {
	padding:10px 0 5px;
	font-weight:bold;
	font-size:125%;
	color:#0096d2;
}
#topics .next-back {
	padding:16px 0 14px;
	position:relative;
}
#topics .next-back p {
	text-align:center;
	color:#c8c8c8;
	font-weight:bold;
}
#topics .next-back .back {
	position:absolute;
	top:15px;
	left:0;
	width:130px;
	text-align:left;
	font-weight:bold;
}
#topics .next-back .next {
	position:absolute;
	top:15px;
	right:0;
	width:130px;
	text-align:right;
	font-weight:bold;
}
#topics .main-area .main-right .top-page {
	padding-top:0;
}

/* トピックス　下層
--------------------------------------------------------------------*/
#topics-u h3 {
	padding-bottom:20px;
}
#topics-u .day {
	padding-bottom:12px;
}
#topics-u .day img {
	vertical-align:middle;
	margin-right:10px;
}
#topics-u h4 {
	padding-bottom:12px;
	font-weight:bold;
	font-size:125%;
	color:#0096d2;
}
#topics-u .image {
	padding-bottom:20px;
	text-align:center;
}
#topics-u .btn {
	padding-top:50px;
	text-align:center;
}
#topics-u .main-area .main-right .top-page {
	padding-top:20px;
}

/* レンタルオフィス
--------------------------------------------------------------------*/
#rental h3 {
	padding-bottom:15px;
}
#rental h3.next {
	padding-top:50px;
}
#rental .top-image {
	padding-bottom:5px;
}
#rental .office-area {
	padding:15px 0;
	border-bottom:dotted 1px #d2d2d2;
}
#rental .office-last {
	border-bottom:solid 1px #e1e1e1 !important;
}
#rental .office-area .photo {
	float:left;
	width:200px;
}
#rental .office-area .photo-r {
	float:right;
	width:480px;
}
#rental .office-area .photo-r .kome {
	padding-top:7px;
}
#rental .setsubi-area .photo {
	float:left;
	width:250px;
}
#rental .setsubi-area .photo-r {
	float:right;
	width:430px;
}
#rental .setsubi-area .photo-r .kome {
	padding-top:10px;
	font-size:85%;
}
#rental .map {
	border-bottom:solid 1px #e1e1e1;
	padding-bottom:50px;
	text-align:center;
}
#rental .btn-area {
	padding:15px 0;
	text-align:center;
}
#rental .btn-area .left {
	margin-right:10px;
}
#rental .main-area .main-right .top-page {
	padding-top:0;
}

/* 料金案内
--------------------------------------------------------------------*/
#price .title {
	padding-bottom:20px;
}
#price h3 {
	padding:30px 0 5px;
	font-weight:bold;
	color:#0096d2;
}
#price h3.next {
	padding:50px 0 5px;
}
#price .campaign {
	margin-top:15px;
	background-color:#fffafa;
	border:solid 1px #c84632;
	padding:11px 15px 10px; 
	color:#c84632;
}
#price .campaign h3 {
	padding:0 0 2px;
	color:#c84632;
}
#price .plan th,
#price .plan td {
	vertical-align:middle;
	border:solid 1px #e1e1e1;
	padding:15px 0 14px;
}
#price .plan th {
	width:150px;
	background-color:#f0f0f0;
	text-align:center;
}
#price .plan td p {
	padding:0 15px;
}
#price .plan .price {
	padding-bottom:3px;
}
#price .plan .price span {
	font-weight:bold;
	color:#c84632;
}
#price .kome {
	padding-top:10px;
}
#price .plan td .kome2 {
	padding:3px 15px 0;
	font-size:85%;
}

/* サービス開始までの流れ
--------------------------------------------------------------------*/
#flow .title {
	padding-bottom:20px;
}
#flow .flow-image {
	padding-bottom:10px;
}
#flow .flow-area {
	padding:15px 0;
	border-bottom:solid 1px #e1e1e1;
}
#flow .flow-last {
	padding:15px 0 0 !important;
	border-bottom:none !important;
}
#flow .flow-area p {
	padding-left:10px;
}
#flow .text {
	margin-top:15px;
	border-top:dotted 1px #d2d2d2;
	padding:15px 0 3px;
	font-weight:bold;
}
#flow .text2 {
	padding-top:7px;
}
#flow .text2 span {
	font-weight:bold;
}
#flow .text3 {
	padding-bottom:3px;
	font-weight:bold;
}
#flow .text4 {
	padding:15px 0 3px;
	font-weight:bold;
}
#flow .box {
	background-color:#f2fafd;
	margin:12px 0 11px 10px;
	padding:15px 10px 14px;
}
#flow .card {
	padding:10px 0 0 10px;
}

/* 周辺情報
--------------------------------------------------------------------*/
#area h3 {
	padding-bottom:15px;
}
#area .area {
	padding-bottom:30px;
}
#area .area .area-left {
	float:left;
	width:240px;
}
#area .area .area-right {
	float:right;
	width:220px;
}
#area .area .area-left .copy {
	padding:15px 20px 4px 0;
	font-size:120%;
}
#area .area .area-right .copy {
	padding:15px 0 4px;
	font-size:120%;
}
#area .area .area-left p {
	padding-right:20px;
}
#area .main-area .main-right .top-page {
	padding-top:20px;
}

/* 交通アクセス
--------------------------------------------------------------------*/
#access h3 {
	padding-bottom:15px;
}
#access #gmap {
	width:700px;
	height:500px;
}
#access .text {
	padding-top:20px;
}

/* 運営会社
--------------------------------------------------------------------*/
#company h3 {
	padding-bottom:2px;
}
#company .profile th,
#company .profile td {
	border-top:dotted 1px #d2d2d2;
	padding:12px 0 11px;
}
#company .profile th.top,
#company .profile td.top {
	border-top:none;
}
#company .profile th {
	width:120px;
}
#company .profile th p {
	padding-left:10px;
}
#company .main-area .main-right .top-page {
	padding-top:0;
}

/* 個人情報の取扱いについて
--------------------------------------------------------------------*/
#privacy h3.next {
	padding-top:50px;
}
#privacy h4 {
	font-weight:bold;
	padding-bottom:5px;
}
#privacy h4.next {
	padding-top:20px;
}
#privacy .text-area {
	padding:12px 10px 0;
}
#privacy .text-area2 {
	padding:12px 10px 10px;
}
#privacy .privacy p {
	padding:3px 0;
}
#privacy .privacy th,
#privacy .privacy td {
	border-top:dotted 1px #d2d2d2;
	border-bottom:dotted 1px #d2d2d2;
	padding:9px 0 8px;
}
#privacy .privacy th p {
	padding:3px 10px;
}
#privacy .days {
	text-align:right;
}

/* 運営会社
--------------------------------------------------------------------*/
#tokutei h3 {
	padding-bottom:2px;
}
#tokutei .tokutei th,
#tokutei .tokutei td {
	border-top:dotted 1px #d2d2d2;
	padding:12px 0 11px;
}
#tokutei .tokutei th.top,
#tokutei .tokutei td.top {
	border-top:none;
}
#tokutei .tokutei th {
	width:170px;
}
#tokutei .tokutei th p {
	padding-left:10px;
}
#tokutei .main-area .main-right .top-page {
	padding-top:0;
}

/* ファーストオフィス会員規約　共通
--------------------------------------------------------------------*/
#kiyaku .top-text {
	padding:12px 10px 15px;
}
#kiyaku h4 {
	border-top:dotted 1px #d2d2d2;
	font-weight:bold;
	padding:15px 10px 5px;
}
#kiyaku h4.top {
	border-top:none !important;
}
#kiyaku .text {
	padding:0 10px 15px;
}
#kiyaku .main-area .main-right .top-page {
	padding-top:0;
}

/* お問い合わせ
--------------------------------------------------------------------*/
#form-page h3 {
	padding-bottom:15px;
}
#form-page .in {
	padding:0 0 20px 10px;
}
#form-page .kome {
	padding-top:10px;
	font-size:85%;
}
#form-page .tel {
	padding-top:13px;
}
#form-page form {
	border-top:solid 1px #e1e1e1;
}
#form-page form th,
#form-page form td {
	padding:10px 0;
	border-bottom:solid 1px #e1e1e1;
}
#form-page form th {
	width:160px;
}
#form-page form th div {
	padding-left:10px;
}
#form-page .require {
	color:#c84632;
	padding-left:3px;
}
#form-page .add-info {
	color:#969696;
	font-size:85%;
	padding-top:8px;
}
#form-page .btn {
	text-align:center;
	padding-top:15px;
}
#form-page .privacy {
	padding:60px 0 0 10px;
	font-size:85%;
}
#form-page .last-info {
	text-align:center;
	padding:120px 0 140px;
}
#form-page .main-area .main-right .top-page {
	padding-top:20px;
}

#form-page .plan-area {
	padding: 0 10px 20px;
}
#form-page .plan-area .plan-left {
	float: left;
	width: 325px;
}
#form-page .plan-area .plan-right {
	float: right;
	width: 325px;
}
#form-page .plan-area .plan a {
	display: block;
	background-color: #78c8fb;
	padding: 70px 0;
	cursor: pointer;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
	font-size: 150%;
	line-height: 150%;
	color: #fff;
}
#form-page .plan-area .plan a:hover {
	opacity: 0.7;
}