@charset "UTF-8";


/*	common
----------------------------------------------------*/

body#works #header #headline p {
font-size:10px;
line-height:20px;
text-indent:48px;
}

body#works #main {
width:901px;
margin:0 auto;
padding:0;
}

body#works #main h2 {
width:219px;
height:38px;
margin:0 0 30px 0;
padding:0;
background:url(/assets_ver3/img/works/main_coding_h2.gif) no-repeat left top;
font-size:1%;
line-height:110%;
text-indent:-9999px;
}

body#works #main .contact {
float:right;
margin:-70px 0 30px 0;
padding:0;
}
body#works #main .contact a {
display:block;
width:132px;
height:46px;
margin:0;
padding:0;
background:url(/assets_ver3/img/works/main_coding_img02.png) no-repeat left top;
font-size:1%;
line-height:110%;
text-indent:-9999px;
}
body#works #main .contact a:hover {
background:url(/assets_ver3/img/works/main_coding_img02.png) no-repeat left -46px;
}

body#works #main h3 {
clear:both;
width:820px;
height:28px;
margin:0 0 15px 0;
background:url(/assets_ver3/img/common/default_h3.gif) no-repeat left top;
color:#7abe40;
font-size:14px;
font-weight:bold;
line-height:28px;
text-decoration:none;
text-indent:3px;
}

body#works #main h4 {
margin:0 0 15px 0;
border-left:3px solid #2f3c44;
color:#2f3c44;
font-size:13px;
font-weight:bold;
line-height:1.1em;
text-indent:6px;
text-decoration:none;
}

body#works #main p {
line-height:2.0em;
}
body#works #main ul.note li {
font-size:90%;
line-height:1.7em;
}


/*	toc
----------------------------------------------------*/

#main #toc {
clear:both;
width:901px;
height:45px;
margin:0;
padding:0;
background:url(/assets_ver3/img/works/main_toc.png) no-repeat left top;
}
#main #toc:after {
clear:both;
display:block;
content:"";
height:1px;
overflow:hidden;
}

#main #toc li {
float:left;
}
#main #toc li.tab01 a {
display:block;
width:151px;
height:45px;
font-size:1px;
line-height:1px;
text-indent:-9999px;
}
#main #toc li.tab02 a,
#main #toc li.tab03 a,
#main #toc li.tab04 a,
#main #toc li.tab05 a,
#main #toc li.tab06 a,
#main #toc li.tab07 a {
display:block;
width:125px;
height:45px;
font-size:1px;
line-height:1px;
text-indent:-9999px;
}

#main #toc li a:hover {background:url(/assets_ver3/img/works/main_toc.png) no-repeat;}

#main #toc li.tab01 a:hover,
#main #toc li.tab01 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat -0px -45px;}

#main #toc li.tab02 a:hover,
#main #toc li.tab02 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat -151px -45px;}

#main #toc li.tab03 a:hover,
#main #toc li.tab03 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat -276px -45px;}

#main #toc li.tab04 a:hover,
#main #toc li.tab04 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat -401px -45px;}

#main #toc li.tab05 a:hover,
#main #toc li.tab05 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat -526px -45px;}

#main #toc li.tab06 a:hover,
#main #toc li.tab06 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat -651px -45px;}

#main #toc li.tab07 a:hover,
#main #toc li.tab07 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat -776px -45px;}

body.sec01 #main #toc li.tab01 a:link,
body.sec01 #main #toc li.tab01 a:visited,
body.sec01 #main #toc li.tab01 a:hover,
body.sec01 #main #toc li.tab01 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat left -90px;}

body.sec02 #main #toc li.tab02 a:link,
body.sec02 #main #toc li.tab02 a:visited,
body.sec02 #main #toc li.tab02 a:hover,
body.sec02 #main #toc li.tab02 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat -151px -90px;}

body.sec03 #main #toc li.tab03 a:link,
body.sec03 #main #toc li.tab03 a:visited,
body.sec03 #main #toc li.tab03 a:hover,
body.sec03 #main #toc li.tab03 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat -276px -90px;}

body.sec04 #main #toc li.tab04 a:link,
body.sec04 #main #toc li.tab04 a:visited,
body.sec04 #main #toc li.tab04 a:hover,
body.sec04 #main #toc li.tab04 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat -401px -90px;}

body.sec05 #main #toc li.tab05 a:link,
body.sec05 #main #toc li.tab05 a:visited,
body.sec05 #main #toc li.tab05 a:hover,
body.sec05 #main #toc li.tab05 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat -526px -90px;}

body.sec06 #main #toc li.tab06 a:link,
body.sec06 #main #toc li.tab06 a:visited,
body.sec06 #main #toc li.tab06 a:hover,
body.sec06 #main #toc li.tab06 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat -651px -90px;}

body.sec07 #main #toc li.tab07 a:link,
body.sec07 #main #toc li.tab07 a:visited,
body.sec07 #main #toc li.tab07 a:hover,
body.sec07 #main #toc li.tab07 a:active {background:url(/assets_ver3/img/works/main_toc.png) no-repeat -776px -90px;}


/*	soon
----------------------------------------------------*/

body#works #main #soon {
clear:both;
margin:0 0 30px 0;
}
body#works #main #soon .cnts {
width:820px;
height:400px;
margin:0;
padding:30px 40px 0 41px;
background:url(/assets_ver3/img/common/default_bg.png) no-repeat left top;
}
body#works #main #soon .cnts:after {
clear:both;
display:block;
content:"";
height:1px;
overflow:hidden;
}
body#works #main #soon .foot {
clear:both;
width:901px;
height:30px;
margin:0;
padding:0;
background:url(/assets_ver3/img/common/default_bg.png) no-repeat left bottom;
}


/*	order
----------------------------------------------------*/

body.sec02 #main ol.flow {
width:820px;
height:32px;
margin:0 0 30px 0;
}
body.sec02 #main ol.flow li {
float:left;
width:205px;
height:32px;
font-size:1%;
line-height:110%;
text-indent:-9999px;
}
body.sec02 #main ol.flow li.step01 {
background:url(/assets_ver3/img/works/main_coding_flow.png) no-repeat left top;
}
body.sec02 #main ol.flow li.step02 {
background:url(/assets_ver3/img/works/main_coding_flow.png) no-repeat -205px top;
}
body.sec02 #main ol.flow li.step03 {
background:url(/assets_ver3/img/works/main_coding_flow.png) no-repeat -410px top;
}
body.sec02 #main ol.flow li.step04 {
background:url(/assets_ver3/img/works/main_coding_flow.png) no-repeat -615px top;
}


/*	price
----------------------------------------------------*/

body.sec03 #main table {
width:820px;
margin:0;
border:none;
border-collapse:collapse;
}
body.sec03 #main table caption {
display:none;
}
body.sec03 #main table th {
padding:20px 15px 17px 15px;
background:url(/assets_ver3/img/common/table.png) no-repeat left top;
border-bottom:2px solid #cccccc;
font-weight:bold;
text-align:left;
vertical-align:middle;
white-space:nowrap;
line-height:1.5em;
}
body.sec03 #main table td {
padding:20px 25px 17px 25px;
margin:0 0 0 5px;
background:url(/assets_ver3/img/common/table.png) no-repeat -500px bottom;
text-align:left;
vertical-align:middle;
line-height:1.5em;
}

body.sec03 #main table td.nw {
white-space:nowrap;
}
body.sec03 #main table td.r {
text-align:right;
}
body.sec03 #main table td.c {
text-align:center;
}


/*	achievements
----------------------------------------------------*/

body.sec05 #main ul.achievements {
margin:0 0 0 50px;
}
body.sec05 #main ul.achievements li {
list-style-type:circle;
line-height:2.0em;
}


/*	ajax
----------------------------------------------------*/

body.sec06 #main #ajax01 {
clear:both;
margin:0 0 50px 0;
}
body.sec06 #main #ajax01:after {
clear:both;
display:block;
content:"";
height:1px;
overflow:hidden;
}
body.sec06 #main #ajax02 {
clear:both;
margin:0 0 50px 0;
}
body.sec06 #main #ajax02:after {
clear:both;
display:block;
content:"";
height:1px;
overflow:hidden;
}
body.sec06 #main #ajax03 {
clear:both;
margin:0 0 50px 0;
}
body.sec06 #main #ajax03:after {
clear:both;
display:block;
content:"";
height:1px;
overflow:hidden;
}
body.sec06 #main #ajax04 {
clear:both;
margin:0 0 50px 0;
}
body.sec06 #main #ajax04:after {
clear:both;
display:block;
content:"";
height:1px;
overflow:hidden;
}

/*--- lightbox -----------*/

body.sec06 #main #ajax01 ul.thumnail li {
float:left;
margin:0 15px 0 0;
font-size:11px;
line-height:1.6em;
}
body.sec06 #main #ajax01 ul.thumnail:after {
clear:both;
display:block;
content:"";
height:1px;
overflow:hidden;
}

/*--- font -----------*/

body.sec06 #main #ajax03 .fontSample {
padding:15px;
border:1px solid #cccccc;
}
body.sec06 #main #ajax03 ul.price {
margin:0 0 30px 0;
}
body.sec06 #main #ajax03 ul.price:after {
clear:both;
display:block;
content:"";
height:1px;
overflow:hidden;
}
body.sec06 #main #ajax03 ul.price li {
float:left;
width:180px;
line-height:1.2em;
}

/*--- png -----------*/

body.sec06 #main #ajax04 ul.price {
margin:0;
}
body.sec06 #main #ajax04 ul.price:after {
clear:both;
display:block;
content:"";
height:1px;
overflow:hidden;
}
body.sec06 #main #ajax04 ul.price li {
float:left;
width:210px;
line-height:1.2em;
}


/*	contact
----------------------------------------------------*/

/*--- flow -----------*/

body#works ol.flow {
width:819px;
height:32px;
margin:0 0 50px 0;
}
body#works ol.flow li {
float:left;
width:273px;
height:32px;
font-size:1%;
line-height:110%;
text-indent:-9999px;
}

body#works ol.flow li.step01a {
background:url(/assets_ver3/img/common/form_flow.png) no-repeat left top;
}
body#works ol.flow li.step01 {
background:url(/assets_ver3/img/common/form_flow.png) no-repeat left -32px;
}
body#works ol.flow li.step02a {
background:url(/assets_ver3/img/common/form_flow.png) no-repeat -273px top;
}
body#works ol.flow li.step02 {
background:url(/assets_ver3/img/common/form_flow.png) no-repeat -273px -32px;
}
body#works ol.flow li.step03a {
background:url(/assets_ver3/img/common/form_flow.png) no-repeat -546px top;
}
body#works ol.flow li.step03 {
background:url(/assets_ver3/img/common/form_flow.png) no-repeat -546px -32px;
}

/*--- form -----------*/

body#works dl.form:after {
clear:both;
display:block;
content:"";
height:1px;
overflow:hidden;
}

body#works dl.form dt {
float:left;
height:23px;
margin:0 30px 0 0;
padding:0 0 0 42px;
color:#7abe40;
font-size:115%;
font-weight:bold;
line-height:20px;
}
body#works dl.form dt.require {
background:url(/assets_ver3/img/common/form_require.gif) no-repeat left top;
}
body#works dl.form dt.require span {
display:none;
}

body#works dl.form dd {
line-height:1.6em;
}
body#works dl.form dd.error {
float:left;
height:23px;
color:#c00000;
font-weight:bold;
line-height:1.7em !important;
}
body#works dl.form dd.example {
clear:both;
width:819px;
height:23px;
margin:0;
padding:0 0 0 42px;
color:#757575;
}
body#works dl.form dd.form {
clear:both;
width:819px;
margin:0 0 50px 0;
padding:0 0 0 42px;
}

body#works dl.form input.style01 {
width:700px;
margin:0 5px 3px 0;
padding:3px;
border:1px solid #cacaca;
background:#fff url(/assets_ver3/img/common/form_input.gif) repeat-x left top;
vertical-align:middle;
}
body#works dl.form input.style02 {
width:100px;
margin:0 5px 3px 0;
padding:3px;
border:1px solid #cacaca;
background:#fff url(/assets_ver3/img/common/form_input.gif) repeat-x left top;
vertical-align:middle;
}

body#works dl.form textarea.style01 {
width:700px;
height:300px;
margin:0 0 3px 0;
padding:3px;
border:1px solid #cacaca;
background:#fff url(/assets_ver3/img/common/form_input.gif) repeat-x left top;
}

body#works div.privacy {
clear:both;
width:700px;
height:200px;
margin:0 0 23px 42px;
padding:5px;
overflow:auto;
border:1px solid #cacaca;
}
body#works div.privacy h3 {
width:670px !important;
height:27px !important;
margin:0 0 15px 0 !important;
padding:0 !important;
background:url(/assets_ver3/img/common/default_h3.gif) no-repeat left bottom !important;
color:#7abe40 !important;
font-size:115% !important;
font-weight:bold !important;
line-height:27px !important;
}
body#works div.privacy h4 {
margin:0 0 6px 0 !important;
padding:0 !important;
color:#292929 !important;
font-size:100% !important;
font-weight:bold !important;
line-height:1.5em !important;
}
body#works div.privacy p {
margin:0 0 15px 0;
}

body#works p.agreement {
margin:0 0 15px 42px;
}
body#works p.submit {
margin:0;
text-align:center;
}
body#works p.submit img {
margin:0 20px 0 0;
}

body#works dl.confirm {
margin:0 0 23px 0;
}
body#works dl.confirm dt {
margin:0 0 3px 0;
color:#7abe40;
font-size:115%;
font-weight:bold;
line-height:20px;
}
body#works dl.confirm dd {
margin:0 0 15px 0;
line-height:1.6em;
}