@charset "utf-8";
/* CSS Document */


/* ---------------会社概要--------------- */


table.profile {
	width:100%;
	border-top:1px dotted #ECA6B0;
}
table.profile th, table.profile td {
	vertical-align:top;
	border-bottom:1px dotted #ECA6B0;
}
table.profile th {
	background:url(file://///Cabin/maeda/proj/www.d-pad-2/images/icon_profile.gif) left top no-repeat;
	padding:15px 0 15px 30px;
}
table.profile td {
	padding:15px;
}
table.profile .font120 {
	font-size:120%;
}

div.number {
	margin:20px auto;
	text-align:center;
}



/* Google map */
div.map {
	height:288px;
	border:1px solid #C2C2C2;
}
div.mapL {
	float:left;
	width:395px;
}
div.mapR {
	float:right;
	width:233px;
	text-align:center;
}

.address {
	padding:0px 0px 35px 0;
}
.address table{
	margin:0 0 15px;
	border:1px dotted #ECA6B0;
	width:100%;
}
.address table th {
	vertical-align:top;
	padding:1em 8px 0 1em;
	width:6em;
}
.address table td {
	padding:1em 1em 1em 0;
}


.mapL p.icon_map {
	background:url(../images/map.png) left center no-repeat;
	min-height:16px;
	padding-left:20px;
	margin-top:3px;
}

ul.access {
	margin:11px 0 0 0;
	list-style-type:square;
	text-align:left;
	border:2px solid #CCC;
}
ul.access li {
	color:#43B6CA;
	margin:10px 5px 5px 30px;
}
ul.access li span {
	color:#333;
}





/* ---------------業務内容--------------- */
table.about_index {
	width:100%;
	border-collapse:collapse;
	margin:20px 0 0;
}
table.about_index td {
	vertical-align:top;
}
table.about_index td.no1 {
	border-bottom:1px solid #CCC;
	border-right:1px solid #CCC;
	padding:15px 10px 15px 0;
}
table.about_index td.no2 {
	border-bottom:1px solid #CCC;
	padding:15px 0 15px 10px;
}
table.about_index td.no3 {
	border-right:1px solid #CCC;
	padding:15px 10px 15px 0;
}
table.about_index td.no4 {
	padding:15px 0 15px 10px;
}
table.about_index td p {
	margin:10px;
	text-align:justify;
	*text-justify:distribute;
}

.sub_about_ipad,
ul.sub_about2_ipad {
	display:none;
}
ul.sub_about {
	position:absolute;
	top:0;
	right:0;
	margin:20px 30px 0 0;
}
ul.sub_about li {
	float:left;
	margin-left:2px;
}

ul.sub_about2 {
	position:absolute;
	top:25px;
	left:277px;
	margin:20px 30px 0 0;
	background:url(../images/sub_about02_bg.gif) no-repeat;
	width:310px;
	height:25px;
}
ul.sub_about2 li {
	float:left;
	margin-top:2px;
}

p.about1 {
	color:#09C;
	font-weight:bold;
	margin:0 0 10px;
}
p.about2 {
	text-align:justify;
	*text-justify:distribute;
	margin:0 0 10px;
}

div.about {
	border:1px dotted #999;
	padding:10px 20px 7px;
	margin:0 0 15px;
}
div.about h4 {
	color:#C30;
	border-bottom:1px solid #C30;
	padding:0 0 0 5px;
}
div.about ul {
	margin:10px 0 0 5px;
}
div.about ul li {
	margin:8px 0;
}

p.back {
	margin:30px 0 0 0;
}




/* ---------------Webサービス--------------- */
table.services {
	width:99%;
	margin:0 auto 10px;
	border-collapse:collapse;
}
table.services th {
	width:250px;
	padding:0 0 10px;
}
table.services td {
	vertical-align:top;
	padding:3px 0 10px 8px;
	text-align:justify;
	*text-justify:distribute;
}
table.services td dt {
	font-weight:bold;
	margin:0 0 2px;
}

table.services td dt.book a {
	color:#339fe3;
}
table.services td dt.book a:hover {
	background-color:#ade6f6;
}
table.services td dt.smartphone a {
	color:#e03462;
}
table.services td dt.smartphone a:hover {
	background-color:#f9c1d0;
}
table.services td dt.inspect a {
	color:#c87474;
}
table.services td dt.inspect a:hover {
	background-color:#f2d5d5;
}
table.services td dt.busical a {
	color:#b757b8;
}
table.services td dt.busical a:hover {
	background-color:#e9c7e9;
}
table.services td dt.qr a {
	color:#b757b8;
}
table.services td dt.qr a:hover {
	background-color:#e9c7e9;
}
table.services td dt.fame a {
	color:#c9a527;
}
table.services td dt.fame a:hover {
	background-color:#ffe99c;
}
table.services td dt.scramble a {
	color:#6cab11;
}
table.services td dt.scramble a:hover {
	background-color:#c9f28e;
}
table.services td dt.enquete a {
	color:#2aa4c7;
}
table.services td dt.enquete a:hover {
	background-color:#ade6f6;
}


/* リンク
=============================================================================*/
div.link {
	width:900px;
	margin:15px auto 0;
}

div.link li{
	float:left;
	padding:0 15px 15px;
}

div.link li a {
	display:block;
	text-indent:-9999px;
	width:150px;
	height:107px;
}

div.link li a:hover {
	background-position: 0 -107px !important;
	text-decoration: none;
}

/* auto generate => /data/links.css */



/* スタッフ募集
=============================================================================*/
table.recruit {
	width:100%;
	margin:15px 0 15px -10px;
}
table.recruit th, table.recruit td {
	padding:0px 10px 5px;
}

table.recruit th.ttl {
	width:9em;
	border-bottom:2px solid #f36188;
}
table.recruit th.ttl2 {
	width:9em;
	border-bottom:2px solid #53C7FF;
}
table.recruit td {
	border-bottom:1px solid #CCC;
	vertical-align:top;
}
table.recruit th {
	vertical-align:bottom;
}



/* コンタクト
=============================================================================*/
div.contact {
	width:90%;
	margin:0 auto;
	text-align:center;
}
span.contact {
	color:#f36188;
	font-weight:bold;
}



/* WEBコンテンツ制作
=============================================================================*/

/* ホームページ制作 */
div.production {
	clear: both;
	margin: 0 0 25px;
}
div.production .imgLeft {
	float: left;
	padding: 0 10px 0 0;
}
div.production dl {
	overflow: hidden;
	padding-top: 3px;
}
div.production dl dd span {
	color: #dc214c;
}

/* clearfix */
div.production:after{
   content:".";
   display:block;
   height:0px;
   clear:both;
   visibility:hidden;
}
div.production{
   display:inline-block;
}
* html div.production{
   height:1px;
}
div.production{
   display:block;
}

.btn_flow,
.btn_contact {
	float: left;
	width: 246px;
	padding: 65px 35px 0px;
}
.btn_flow {
	background: url(../images/pro_btn_flow_arrow.gif) no-repeat center top;
}
.btn_contact {
	background: url(../images/pro_btn_contact_arrow.gif) no-repeat center top;
}

div.btn_smartphone {
	clear: both;
	padding: 0 20px 0 0;
}
div.btn_smartphone p {
	margin: 0 auto;
	padding: 60px 0 0 0;
	width: 246px;
	background: url(../images/pro_btn_smartphone_arrow.gif) no-repeat center top;
}


/* ホームページ制作の流れ */
div.flow {
	clear: both;
	margin: 0 0 5px 10px;
	padding: 7px 0 10px 60px;
	border: 5px solid #dbecf2;
}

div.step01 {
	background: url(../images/step01.gif) no-repeat 10px 10px;
}
div.step02 {
	background: url(../images/step02.gif) no-repeat 10px 10px;
}
div.step03 {
	background: url(../images/step03.gif) no-repeat 10px 10px;
}
div.step04 {
	background: url(../images/step04.gif) no-repeat 10px 10px;
}
div.step05 {
	background: url(../images/step05.gif) no-repeat 10px 10px;
}
div.step06 {
	background: url(../images/step06.gif) no-repeat 10px 10px;
}
div.step07 {
	background: url(../images/step07.gif) no-repeat 10px 10px;
}
div.step08 {
	background: url(../images/step08.gif) no-repeat 10px 10px;
}
div.step09 {
	background: url(../images/step09.gif) no-repeat 10px 10px;
}
div.step10 {
	background: url(../images/step10.gif) no-repeat 10px 10px;
}

div.flow .imgRight {
	float: right;
	padding: 0 10px 0 15px;
}

/*
div.flow dl {
	padding: 0 0 60px;
	background: url(../images/step_arrow.gif) no-repeat 160px bottom;
}
*/
.arrow {
	padding: 0 0 5px;
	text-align: center;
}

div.flow.last dl {
	background: url(../images/pro_btn_flow_arrow02.gif) no-repeat 160px bottom;
}

div.flow dd {
	margin: 0 0 0 15px;
}
div.flow dd.tel img {
	margin: 5px 18px 0 0;
}

/* clearfix */
div.flow:after{
   content:".";
   display:block;
   height:0px;
   clear:both;
   visibility:hidden;
}
div.flow{
   display:inline-block;
}
* html div.flow{
   height:1px;
}
div.flow{
   display:block;
}

.btn_contact02 {
	margin: 0 0 0;
	padding: 5px 0 20px;
	text-align: center;
}



/* Webアプリケーション */
table.web_appli {
	margin: 9px auto 0;
	border-collapse: collapse;
	border-spacing: 0;
}

table.web_appli td {
	padding: 1px;
}

table.web_appli td.b_left {
	border-left: 1px solid #ccc;
}
table.web_appli td.b_right {
	border-right: 1px solid #ccc;
}
table.web_appli td.b_bottom {
	border-bottom: 1px solid #ccc;
}

.btn_contact2 {
	width: 246px;
	margin: 20px auto 0;
	padding: 35px 35px 40px;
}
.btn_contact2 {
	background: url(../images/pro_btn_flow_arrow02.gif) no-repeat center top;
}


/* iPad用css
=============================================================================*/
@media screen and (max-width: 1024px) {

body {
	background:#FFF url(../images/bg_header.gif) center 15px no-repeat;
	font-size:75%;
}

img {
    max-width:100%;
    height:auto;
}

#header {
	width:100%;
	height:auto;
	margin:0 auto;
}

#logo {
	float:none;
	margin:0 auto;
	padding:5px 0 0 10px;
	background:#fff;
}

#navi {
	float:none;
	width:845px;
	margin:40px auto 0;
	padding-bottom:30px;
}

#navi li {
	float:left;
	margin-left:40px;
}

#wrap,
#wrap-wide {
	width:90%;
	background:none;
}

#main,
#main-wide {
	float:none;
	width:100%;
	margin:0 auto;
	padding-left:0;
}

ul.services li.pr20 {
	padding-right:15px;
}
ul.services li.pb10 {
	padding-bottom:0;
}
ul.services li img {
	width:433px;
	height:auto;
	margin: 0 !important;
	padding: 0 0 15px 0;
}

div.expert img {
	width:100%;
	height:auto;
}

/*
div.news {
	width:63%;
	padding:25px 0 0;
}
div.news table th {
	background:url(../images/icon_circle.gif) left 5px no-repeat;
}
div.expert {
	width:292px;
	padding:98px 0 0;
}
*/

#banner {
	clear:both;
	float:none;
	width:110%;
	margin:0 auto;
	padding:40px 0 0;
}

#banner li {
	float:left;
	padding: 0 10px 5px 0;
}

#banner li img {
    width:285px;
    height:auto;
}

#pagetop {
	clear:both;
	width:90%;
	padding-left:0;
	text-align:right;
}

#footer_wrap {
	width:100%;
	height:auto;
	padding: 0 0 38px;
}

#footer {
	width:100%;
}

#navi-footer {
	float: none;
	padding-top:5px;
}

#navi-footer ul {
	width:63%;
	margin:0 auto;
	text-align:center;
}

#navi-footer li {
	float:left;
	margin-right:35px;
}

#copyright {
	clear:both;
	float:none;
	margin:0 auto;
	padding-top:25px;
}

#banner img,
div.webcam {
	display:none;
}
#banner ul img {
	display:inline;
}

/* ---- profile ---- */
div.map {
	height:288px;
}
div.mapL {
	width:630px;
}
div.mapR {
	width:233px;
}
.mapL p.icon_map {
	margin-top:5px;
}
ul.access li {
	margin:10px 5px 5px 25px;
	font-size:88%;
}

/* ---- abut us ---- */
ul.sub_about,
ul.sub_about2 {
	display:none;
}
.sub_about_ipad {
	display:inline;
	margin:-10px auto 0;
  position: relative;
  overflow: hidden;
}
.sub_about_ipad ul {
  position: relative;
  left: 50%;
  float: left;
}
.sub_about_ipad ul li {
	float:left;
	margin-left:5px;
	padding:5px 10px;
	background:#c28163;
  position: relative;
  left: -50%;
  float: left;
}
.sub_about_ipad ul li a {
	color:#fff;
	text-decoration:none;
}
.sub_about_ipad ul li.active {
	background:#f36188;
}
.sub_about_ipad ul li.active2 {
	padding:5px 10px 8px;
	background:#f36188;
}

.paddingTop30 {
	padding-top:30px;
}

p.box {
	clear:both;
	display:block;
	padding-top:15px;
}

ul.sub_about2_ipad {
	clear:both;
	display:block;
	margin:0 0 0 220px;
	padding: 0 0 25px;
}
ul.sub_about2_ipad li {
	float:left;
	margin-left:1px;
	padding:5px 10px;
	background:#f36188;
}
ul.sub_about2_ipad li a {
	color:#fff;
	text-decoration:none;
}
ul.sub_about2_ipad li.active {
	background:#fddb63;
}
ul.sub_about2_ipad li.active a {
	color:#f36188;
}

p.back {
	display:none;
}

.btn {
	text-align:center;
}
.btn_flow,
.btn_contact {
	width: 42%;
}


table.web_appli {
	width:95%;
}
table.web_appli td {
	text-align:center;
	vertical-align:middle;
}

/* ---- Web services ---- */


}

@media only screen and
(min-device-width : 768px) and
(max-device-width : 1024px) and
(orientation : portrait) {

body {
	font-size: 100%;
}

ul.access li {
	font-size:75%;
}

}