/* フォーマット
------------------------------------------*/
div,p,span,img{
margin:0px;
padding:0px;
}
.left{
float:left;
}
.right{
float:right;
}
.center{
text-align:center;
}
ul li{
list-style:none;
}
.clr{
clear:both;
font-size:0;
line-height:0;
margin:0;
padding:0
}


/* 
===========================================
PC
===========================================
*/

/* hタイトル
------------------------------------------*/
h2{
height:410px;
margin:0;
padding:0;
}
h3{
padding:0;
}
h4{
padding:40px 0 0 0;
text-align:center;
}

.caption{
font-size:0.857em;
color:#666666;
}



/* メインビジュアル
------------------------------------------*/
#main {
background:url(../images/bg_main.gif) no-repeat;
background-position:top center;
}

#anc-case-set{
width:930px;
overflow:hidden;
padding:0 10px 20px 10px;
background-color:#f9f9f4;
}
#anc-case-set .anc-case {
width:300px;
float:left;
margin-right:14px;
background-image:url(../images/bg_main_top.gif);
background-position:top;
background-repeat:no-repeat;
zoom:1;
}
#anc-case-set .anc-case-end {
width:300px;
float:left;
margin:0 0 0 0;
background-image:url(../images/bg_main_top.gif);
background-position:top;
background-repeat:no-repeat;
zoom:1;
}
#anc-case-set .inner {
background-image:url(../images/bg_main_inner_btm.gif);
background-position:bottom;
background-repeat:no-repeat;
padding:0 0 0 10px;
zoom:1;
}
#anc-case-set .inner p {
padding:10px 10px;
}
#anc-case-set .inner img{
margin:0 1px 1px -9px;
}


/* 場面紹介
------------------------------------------*/
.case{
width:950px;
}
.center{
text-align:center
}
img.ng{
margin-right:15px;
}
img.ok{
margin-left:15px;
}


/* 手順紹介
------------------------------------------*/
#flow1 {
width:920px;
margin:20px auto;
background-image:url(../images/bg_case1_flow_top.gif);
background-position:top;
background-repeat:no-repeat;
zoom:1;
}
#flow1 .inner {
background-image:url(../images/bg_case1_flow_btm.gif);
background-position:bottom;
background-repeat:no-repeat;
padding:0 10px 20px 10px;
zoom:1;
overflow:hidden;
}
#flow2 {
width:920px;
margin:20px auto;
background-image:url(../images/bg_case2_flow_top.gif);
background-position:top;
background-repeat:no-repeat;
zoom:1;
}
#flow2 .inner {
background-image:url(../images/bg_case2_flow_btm.gif);
background-position:bottom;
background-repeat:no-repeat;
padding:0 10px 20px 10px;
zoom:1;
overflow:hidden;
}
#flow3 {
width:920px;
margin:20px auto;
background-image:url(../images/bg_case3_flow_top.gif);
background-position:top;
background-repeat:no-repeat;
zoom:1;
}
#flow3 .inner {
background-image:url(../images/bg_case3_flow_btm.gif);
background-position:bottom;
background-repeat:no-repeat;
padding:0 10px 20px 10px;
zoom:1;
overflow:hidden;
}

ul.flow{
width:874px;
overflow:hidden;
margin:0 0 0 -10px;
}
ul.flow li {
float:left;
width:220px;
text-align:left;
}
ul.flow li.no-arrow {
float:left;
width:220px;
text-align:left;
margin-right:34px;
}
ul.flow li.catch {
float:left;
width:130px;
}
ul.flow li.arrow {
float:left;
width:40px;
margin-top:60px;
}



/* 製品導線
------------------------------------------*/
#product{clear:both;margin:20px 0 20px 0x;*zoom:1}
#product:after{content:'';display:block;clear:both;height:0}

#product h2{margin:40px 0 20px 20px; height:auto}

#product .item{width:460px;float:left;*display:inline;margin:0 0 0 15px}
#product .item-image{float:left;margin-right:30px}
#product .item-text{overflow:hidden;*zoom:1}
#product .item-text h3{font-size:1.23077em;line-height:1.2;margin:0 0 10px}
#product .item-text p{margin:0 0 .5em}





/* 
===========================================
MB
===========================================
*/

@media (max-width:640px){
html {
font-size: 18px;
color:#333333;
}

#main img{
width:100%;
height:auto;
}


/* hタイトル
------------------------------------------*/
h2{
margin:0 0 -5px 0;
height:auto;
}
h3{
margin:20px 0 0 0;
}
h4{
font-size:1.23077em;
margin:0 0 0 0;
text-align:center;
}




/* 場面紹介
------------------------------------------*/
.case{
width:100%;
}
#case1 img,#case2 img,#case3 img{
width:100%;
height:auto;
}
img.ok{
margin:10px 0 0 0;
}


/* 手順紹介
------------------------------------------*/

#flow1-mb {
width:auto;
margin:20px auto;
background-image:url(../images/bg_case1_flow_top.gif);
background-position:top;
background-repeat:no-repeat;
zoom:1;
text-align:center;
}
#flow1-mb .inner {
background-image:url(../images/bg_case1_flow_btm.gif);
background-position:bottom;
background-repeat:no-repeat;
padding:10px 10px 0px;
zoom:1;
overflow:hidden;
}
#flow2-mb {
width:auto;
margin:20px auto;
background-image:url(../images/bg_case2_flow_top.gif);
background-position:top;
background-repeat:no-repeat;
zoom:1;
text-align:center;
}
#flow2-mb .inner {
background-image:url(../images/bg_case2_flow_btm.gif);
background-position:bottom;
background-repeat:no-repeat;
padding:10px 10px 0px;
zoom:1;
overflow:hidden;
}
#flow3-mb {
width:auto;
margin:20px auto;
background-image:url(../images/bg_case3_flow_top.gif);
background-position:top;
background-repeat:no-repeat;
zoom:1;
text-align:center;
}
#flow3-mb .inner {
background-image:url(../images/bg_case3_flow_btm.gif);
background-position:bottom;
background-repeat:no-repeat;
padding:10px 10px 0px;
zoom:1;
overflow:hidden;
}

ul.flow1-mb img,
ul.flow2-mb img,
ul.flow3-mb img{
width:100%;
height:auto;
margin:0 0 0 -10px;
}
ul.flow1-mb li,
ul.flow2-mb li,
ul.flow3-mb li{
text-align:left;
margin:0px 0px 30px -20px;
}
ul.flow1-mb li img,
ul.flow2-mb li img,
ul.flow3-mb li img{
text-align:left;
margin:0 0 0 0;
}


/* 製品紹介
------------------------------------------*/
#product h2 img{width:100%;height:auto; margin:0 0 0 -10px;}
#product .item{width:100%;text-align:center;*display:inline;}
#product .item-image{float:none;text-align:center;}
#product .item-image img{width:80%;height:auto;}
#product .item-text{clear:both;overflow:hidden;*zoom:1;margin:0 0 0 -10px;}
#product .item-text h3{font-size:1.23077em;line-height:1.2;}
#product .item-text p{margin:0 0 .5em;}

}