@charset "utf-8";

/* Basic */
html {
background: #F9F9F9;
}

body
{
font-family: 'メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
font-size: 16px;
line-height: 1.5;
text-align: left;
color: #000;
}

img { vertical-align: top; }


li { list-style: none; }

a { color: #535353; }
a:visited { color: #535353; }
a:hover
{
text-decoration: none;
opacity:.80; /* Standard: FF gt 1.5, Opera, Safari */
filter:alpha(opacity=80); /* IE lt 8 */
-ms-filter:"alpha(opacity=80)"; /* IE 8 */
-khtml-opacity:.80; /* Safari 1.x */
-moz-opacity:.80; /* FF lt 1.5, Netscape */
}
.clear{
clear:both;
}
#container
{
margin: 0 auto;
width: 968px;
}


#contents .wrap
{
background: url(../images/bg_mdl.jpg) 0 0 repeat-y;
padding: 10px 0;
}

#input, #realtime, #time_stamp, #setup, #soft, #verup,#security, #support, #data, #voice
{
width: 910px;
margin: 0 auto;
}



/* Header */
#header {
overflow: hidden;
margin: 20px 0 15px;
}

#header ul li
{
float: left;
}

#header ul li.txt
{
margin: 0 20px 0 117px;
}


/* main */
#contents .cv_top
{
background: url(../images/bg_mdl.gif) 0 0 repeat-y;
}

#contents .cv_top ul
{
margin: 0 auto;
overflow: hidden;
}

#contents .cv_top ul li
{
text-align:center;
}
#contents .cv_top ul li.estimate
{
padding: 20px 0 0 0;
}
#contents .cv_top ul li.contact
{
padding: 15px 0 15px;
}

#contents .cv_top ul li.trial
{
float:left;
padding: 0 0 0 45px;
}
/* CV */
#contents .cv
{
height: 380px;
}
#contents .cv ul
{
width: 890px;
margin: 0 auto;
overflow: hidden;
}

#contents .cv ul li
{
text-align:center;
}

#contents .cv ul li.estimate
{
padding: 25px 0 0 0;
}

#contents .cv ul li.contact
{
padding: 15px 0 15px;
}

#contents .cv ul li.trial
{
float:left;
padding: 0 15px;
}


/* voice */
#voice
{
margin-bottom: 0;
}

#voice h3
{
margin-bottom: 20px;
}

#voice .line
{
padding-top: 10px;
}

#voice .voce_list
{
width: 843px;
margin: 0 auto;
background: url(../images/voice_bg_mdl.gif) 0 0 repeat-y;
}

#voice .voce_list dl
{
width: 800px;
margin: 0 auto;
overflow: hidden;
}

#voice .voce_list dl dt
{
width: 163px;
float: left;
}

#voice .voce_list dl dt.logo01
{
padding-top: 15px;
}

#voice .voce_list dl dt.logo02
{
padding-top: 25px;
}

#voice .voce_list dl dt.logo03
{
padding-top: 45px;
}

#voice .voce_list dl dt.logo04
{
padding-top: 35px;
}

#voice .voce_list dl dd
{
width:570px;
float: right;
padding-right: 10px;
}

#voice .voce_list dl dd h4
{
font-size: 23px;
color: #47AE20;
margin-bottom: 5px;
}

#voice .voce_list dl dd ul
{
margin-left: 20px;
text-align:left;
}

#voice .voce_list dl dd ul li
{
list-style: disc;
margin-bottom: 8px;
}


/* Footer */
#footer
{
clear: both;
margin: 20px 0 0;
overflow: hidden;
}

#footer .logo
{
float: left;
margin-right: 20px;
}

#footer .address
{
float: left;
}

#footer .pp
{
float: right;
}


/* For modern browsers */
.cf:before,
.cf:after {
content:"";
display:block;
overflow:hidden;
}

.cf:after {
clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
.cf {
zoom:1;
}

#contents .round
{
background: url(../images/bg_mdl02.gif) 0 0 repeat-y;
padding: 0;
text-align:center;
 }
 
#contents .square
{
background: url(../images/bg_mdls.gif) 0 0 repeat-y;
text-align:center;
width:910px;
margin:0 auto;
padding:0;
 }
#contents .squarebtm
{
text-align:center;
width:910px;
margin:0 auto;
padding:0;
}
.kadomaru {
   -moz-border-radius: 10px;    /* Firefox */
   -webkit-border-radius: 10px; /* Safari,Chrome */
   border-radius: 10px;         /* CSS3 */

   border: 0;
   background-color: #1D9E48;
   color:#FFF;
   font-size:90%;
   line-height:1.2;
   padding:8px 10px 4px 10px;
   text-align:left;
}


#contents .round .ancorarea{
height:120px;
}
#anchor{
margin: 0; 
padding: 0; 
list-style: none;
}
#anchor li{ 
display: inline; 
padding: 0; 
margin: 0; 
float: left;
}

.ninja_omatome_box .ninja_omatome_box_footer {
height:24px;
}

.ninja_omatome_box .ninja_omatome_box_footer a.sprite-ninja_16 {
display:none;
}

/* CSS3 ModalWindow SET
-------------------------- */
#open01,
#open02 {
top: 0;
left: 0;
width: 100%;
height: 100%;
display: none;
position: absolute;
}

.close_overlay {
top: 0;
left: 0;
width: 100%;
height: 300%;
display: block;
text-indent: -9999px;
position: absolute;
background: #000;
opacity: 0.5;
z-index: 5;
}

.modal_window {
bottom: 30px;
left: 5px;
width: 400px;
height: 560px;
display: block;
background: #fff;
position: absolute;
z-index: 10;
}

.modal_window h2 {
width: 400px;
height: 30px;
line-height: 30px;
color: #fff;
font-size: 14px;
font-weight: bold;
text-align: left;
text-indent: 15px;
background: #e67e00;
}

.modal_window h2 a {
color:#fff;
text-decoration:none;
}

.modal_window p {
padding: 10px 15px 0px 15px;
font-size: 12px;
line-height: 160%;
text-align: left;
}

.modal_window p a {
color:gray;
text-decoration:none;
}

@-webkit-keyframes modalFadeIn {
0% {opacity:0;display:block;}
100% {opacity:1;}
}

div#modal div:target {
-webkit-animation-name: modalFadeIn; 
  -webkit-animation-duration: 1s;
  -webkit-animation-iteration-count: 1;
opacity: 1;
display:block;
}

div.modal_face {
position: fixed;
bottom: 0px;
left:5px;
width: 180px;
height: 26px;
padding: 5px 0 0 15px;
color: #fff;
background-color: #e67e00;
background-image: url("images/bg_tab_button.gif");
background-repeat: repeat-x;
border-left: 1px solid #e98400;
border-right: 1px solid #e98400;
border-top: 1px solid #e98400;
border-radius: 3px 3px 0 0;
font-family: 'メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
font-size: 14px;
line-height: 26px;
text-align: left;
}

div.modal_face a {
color:#fff;
text-decoration:none;
}

.fsBody {
    padding: 0px !important;
}

.fsBody .fsForm {
    margin: 0px auto !important;
    padding: 10px 20px !important;
}

.fsBody .fsFieldRow, .fsBody .fsRowBody {
    margin-bottom: 10px!important;
}

.fsLabelVertical .fsLabel {
    margin-bottom: 5px !important;
    text-align: left;
}

.fsForm select, .fsRowBody input[type=email], .fsRowBody input[type=number], .fsRowBody input[type=tel], .fsRowBody input[type=text] {
    height: 30px !important;
}

.fsForm .fsSubmit {
    margin-top: 0px !important;
    padding: 0px !important;
}


/* メール登録ページ　Header */
#header_mail {
width:968px;
overflow: hidden;
margin: 20px auto 15px;
}

#header_mail ul li
{
float: left;
}

#header_mail ul li.txt
{
margin: 0 20px 0 117px;
}

@media screen and (max-width: 768px) {
	#design_change #container {
		margin: 0 auto;
		width: 95%;
/*    overflow: hidden;*/
	}
	#header ul li {
		float: none;
		margin: auto auto 10px;
	}
	#header ul li.txt {
		margin: auto auto 10px;
	}
  #design_change #header_mail {
    width: 95%;
    overflow: hidden;
    margin: 20px auto 15px;
  }
}