﻿@charset "utf-8";


body,div,dl,dt,dd,ul,ol,li,
h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,
p,blockquote,th,td {
margin:0;
padding:0;
}

ol,ul {list-style:none;}

img {border:0; display:block;}

table{
border-collapse:collapse;
border-spacing:0;
}


a:link, a:visited{ color:#303031; }
a:hover, a:active{ color:#c8edce; }

body{ color:#333; background:url(./images/bg/bg01.jpg) 0 0 repeat-x; }

div#wapper{ width:100%; }

div#sidebox a{ font-size:0.8em; }

/* ヘッダ */
div#header{
	margin:0 auto;
	width:900px;
	height:77px;
	position:relative;
}
div#header h1{
	position:absolute;
	left:0px;
	top:15px;
}
div#header p#header_logo02{ position:absolute; top:10px; left:0px; }
div#header p#header_tel{ position:absolute; top:10px; right:0px; }

/* 上部ナビ */
div.gnavi {
	background: #303031 url("../image/gnavi-x.jpg");
	width: 100%;
}
ul#gnavi{ position:relative; width:790px; height:34px; margin:0 auto; }
ul#gnavi li{ float:left; }
ul#gnavi li#gnavi_left{ position:absolute; left:-1px; }
ul#gnavi li#gnavi_right{ position:absolute; right:-1px; }
ul#gnavi:after{ clear:both; content:" "; height:0; visibility:hidden; display:block; }

/* パンクズ */
p#tip{ padding:8px 7px 11px; width:900px; margin:0 auto; font-size:0.8em; color: #303031; }
#tip a:link, a:visited{ color:#303031; }
#tip a:hover, a:active{ color:#257f37; }

/* イメージエリア */
div#image_area{ width:900px; margin: 15px auto 25px auto; padding:0; }
html {overflow:scroll; }
div#header p#mainv{ position:absolute; top:5px; left:1px; }

/* メインエリア */
div#mainarea{ width:900px; margin:0 auto; }
div#mainarea:after{ clear:both; content:" "; height:0; visibility:hidden; display:block; }
div#mainarea div#mainbox{ width:700px; float:right; }
div#mainarea div#sidebox{ width:180px; float:left; }
div#mainarea div#formWrap{ width:700px; float:right; }

.top-mess {
	font-size: 0.9em;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 3%;
	margin-right: 0%;
	line-height: 1.4em;
}
/* 電子書籍制作 */
h2#epub_title {
	margin-top: 0;
	margin-bottom: 20px;
	margin-left: 0;
	margin-right: 0;
}
.epub1_main {
	font-size: 0.8em;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 0;
	margin-right: 0;
	line-height: 1.6em;
}
/* 企業情報 */
h2#company_title {
	margin-top: 0;
	margin-bottom: 20px;
	margin-left: 0;
	margin-right: 0;
}
.company1_main {
	font-size: 0.8em;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 0;
	margin-right: 0;
	line-height: 1.6em;
	word-break: keep-all;
}
.down_2em {
	margin-left: 2.0em;
}
.down_4em {
	margin-left: 4.0em;
}
ul#company2_shiga li {
	float: right;
}
.company_map {
	float:left;
	margin-top: 0;
	margin-bottom: 0px;
	margin-left: 0;
	width: 500px;
	height: 480px;
	border-style: solid;
	border-width: 1px;
	border-color:#000000;
	margin-right: 20px;
}
.company3_txt {
	font-family: sans-serif;
	font-size: 0.8em;
	font-weight: 500;
	line-height: 1.7em;
}
/* 料金体系 */
h2#fee_title {
	margin-top: 0;
	margin-bottom: 20px;
	margin-left: 0;
	margin-right: 0;
}
.fee1_main {
	font-size: 0.8em;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 0;
	margin-right: 0;
	line-height: 1.6em;
	word-break: keep-all;
}
.down_1em {
	margin-left: 1.0em;
}
/* プライバシーポリシー */
h2#privacy_title {
	margin-top: 0;
	margin-bottom: 20px;
	margin-left: 0;
	margin-right: 0;
}
.privacy1_main {
	font-size: 0.8em;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 0;
	margin-right: 0;
	line-height: 1.6em;
	word-break: keep-all;
}
.down_1em {
	margin-left: 1.0em;
}
.page_close {
	text-align:right;
}

/* 制作実績 */
h2#performance_title {
	margin-top: 0;
	margin-bottom: 20px;
	margin-left: 0;
	margin-right: 0;
}
.performance_main {
	font-size: 0.8em;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 0;
	margin-right: 0;
	line-height: 1.6em;
	word-break: keep-all;
}
div.performance {
	background: #ffffff;
	width: 100%;
}
ul#performance{ position:relative; width:900px; margin:0 auto; }
ul#performance li{ position:relative; background-color: #e8e8e8; display: inline-block; font-size: 10px; width:140px; padding:10px 10px 10px 10px; margin-right: 11px; margin-bottom: 15px;}
ul#performance li .center_img { left: 0; right: 0; margin: auto; box-shadow: 3px 3px 2px 1px rgba(0,0,0,0.2);}
ul#performance li .center_img_yoko1 { left: 0; right: 0; margin-left:14px; margin-top:23px; margin-bottom:21px; box-shadow: 3px 3px 2px 1px rgba(0,0,0,0.2);}

p#performance_link{ padding:8px 7px 11px; width:680px; margin:0 auto; font-size:0.8em; color: #303031; }
#performance_link a:link, a:visited{ color:#303031; }
#performance_link a:hover, a:active{ color:#257f37; }

/* 制作実績（モーダルポップアップ） */
.modal > label {
background: #FFD300;
color: #fff;
cursor: zoom-in;
display: inline-block;
text-align:center;
position:relative; background-color: #e8e8e8; display: inline-block; font-size: 0.8em; width:140px; padding:0px 0px 0px 0px; margin-right: 0px; margin-bottom: 0px;
}

.modal-overlay {
background:rgba(0,0,0,0.8);
position: fixed;
top: 20%;
padding: 10px 20px 10px 20px;
text-align:left;
}

.modal-wrap {
position: relative;
margin: 10 auto;
font-size: 1.2em;
color: #fff;
line-height: 1.3em;
}

/* ×ボタン＆ポインタ誘導案
.modal-wrap > label {
background: #c5eece;
color: #257f37;
cursor: pointer;
font-size: 3.0em;
display: inline-block;
line-height: 1.0em;
margin-bottom: 10px;
left: 0;
text-align:left;
} */

/* ×ボタンなし＆ズームアウト虫眼鏡案 */
.modal-wrap > label {
cursor: zoom-out;
font-size: 2.0em;
display: inline-block;
line-height: 1.0em;
margin-top: 10px;
margin-bottom: -6px;
left: 0;
text-align:left;
}

input {
position: absolute;
z-index: -9999;
visibility: hidden;
}

.modal-overlay {
opacity:0;
	-webkit-transform: scale(0.5);
	-moz-transform: scale(0.5);
	-ms-transform: scale(0.5);
	-o-transform: scale(0.5);
	transform: scale(0.5);
	-webkit-transition: all 0.75s cubic-bezier(0.65, -0.55, 0.265, 1.55);
	-moz-transition: all 0.75s cubic-bezier(0.65, -0.55, 0.265, 1.55);
	-ms-transition: all 0.75s cubic-bezier(0.65, -0.55, 0.265, 1.55);
	-o-transition: all 0.75s cubic-bezier(0.65, -0.55, 0.265, 1.55);
	transition: all 0.75s cubic-bezier(0.65, -0.55, 0.265, 1.55);
z-index: -999;
}

input:checked ~ .modal-overlay {
opacity: 1;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-0-transform: scale(1);
	transform: scale(1);
z-index: 999;
}
/* 制作実績（モーダルポップアップ）ここまで */


/* -------------------------------------------------------------
問合せフォーム用スタイル
---------------------------------------------------------------- */
h2#contact_title {
	margin-top: 0;
	margin-bottom: 20px;
	margin-left: 0;
	margin-right: 0;
}
.contact_main {
	font-size: 0.8em;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 0;
	margin-right: 0;
	line-height: 1.6em;
	word-break: keep-all;
}
/* -max--------------------------------------------------------- */
.formWrap{
	width:690px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	color:#555;
	line-height:120%;
	font-size:90%;
}
table.formTable{
	width:100%;
	margin: 5px auto 5px auto;
	border-collapse:collapse;
}

table.formTable td,table.formTable th{
	border:1px solid #ccc;
	padding:10px;
}

table.formTable th{
	width:30%;
	font-weight:normal;
	background:#efefef;
	text-align:left;
}
.form_kome {
	font-size:0.8em;
	color: #0000ff;
}
.tadasi {
	font-size:0.8em;
	margin: 5px auto;
}

/* -690--------------------------------------------------------- */
@media only screen and (max-width:690px) {
}

/* ---------------------------------------------------------690- */
/* -480--------------------------------------------------------- */
@media only screen and (max-width:480px) {
table.formTable td, table th {
	width:100%;
	margin:-1px 0px 0 0;
	display: block;
	padding: 10px;
}
table.formTable th {
	width:100%;
	margin:-1px 0px 0 0;
	background-color: #eee;
}

}
/* ---------------------------------------------------------480- */





/* サイドボックス */
div#sidebox p.side_cap01{ margin:0 auto; padding:0; }

.sid_box {
  width: 180px;
  position: fixed;
  top: 0px;
  z-index: 100;
}
ul#side_menu01 {
	background-color:#e8e8e8;
	color: #303031;
	margin-top: 0;
	margin-bottom: 10px;
	text-align: center;
	font-size: 1.0em;
	padding-top: 20px;
	padding-bottom: 20px;
	line-height: 1.8em;
	width: 180px;
	font-family: sans-serif; 
	font-weight: 500;
}
#side_menu01 a:link, a:visited{ color:#303031; }
#side_menu01 a:hover, a:active{ color:#257f37; }
li#side_menu01 li a{ margin:30px; padding:30px; }

ul#side_guide01 li{ padding:5px 0 5px 0; }


/* フッタ */
#footer {
	background-color: #303031;
	color: #ffffff;
	text-align: center;
	font-size: 0.8em;
	padding-top: 1.0em;
	padding-bottom: 1.0em;
	line-height: 1.6em;
}

#footer a:link{ color:#ffffff; }
#footer a:visited{ color:#ffffff; }
#footer a:hover, a:active{ color:#c8edce; }


div#container{ width:900px; margin:0 auto; padding:0; }
html {overflow:scroll; }

#go_top {
	margin:48px auto 15px auto;
	padding:0;
	width:900px;
	font-size: 0.8em;
	text-align:right
}
#go_top a:link, a:visited{ color:#303031; }
#go_top a:hover, a:active{ color:#257f37; }

#go_top img {
	display:inline;
}


