@charset "UTF-8";

/*   
Theme Name:MOBILE VISION
Theme URI:http://www.freemethod.mobi/
Description:モバイルヴィジョン
Author:FREEMETHOD
Author URI:http://www.freemethod.net/
Version:1.0
*/

/*--------------------------------------------------------------------
common
cssの初期化
--------------------------------------------------------------------*/


* {
font-family: "ＭＳ Ｐゴシック", "Osaka", "ヒラギノ角ゴ Pro W3", sans-serif;
margin: 0;
padding: 0;
color:#333333;
line-height:1.8em;

}


/*bodyのスタイル*/

body {
text-align: center;
margin: 0px;
padding: 0px;
font-size:12px;
background: url(images/i_bg3.jpg) 0 0 repeat;
height:100%;
}

p {
margin-top: 10px;
margin-bottom: 10px;
padding: 0px;
margin-right: 0px;
margin-left: 0px;
text-align:left;
font-size:12px;
}

img{
padding:0px;
margin:0px;
}

html, body {
font-family: "ＭＳ Ｐゴシック", "Osaka", "ヒラギノ角ゴ Pro W3", sans-serif;
margin: 0;
padding: 0;
font-size: 100%;
}

h2, h3, h4, h5, h6, address, div, blockquote, p, pre, li, dl, dt, dd, hr {
font-family: "ＭＳ Ｐゴシック", "Osaka", "ヒラギノ角ゴ Pro W3", sans-serif;
margin: 0;
padding: 0;
border: 0;
font-style: normal;
font-weight: normal;
font-size: 100%;
}

table, caption, th, td {
font-family: "ＭＳ Ｐゴシック", "Osaka", "ヒラギノ角ゴ Pro W3", sans-serif;
margin: 0;
padding: 0;
border: 0;
font-style: normal;
font-weight: normal;
font-size: 100%;
}

span, em, strong, dfn, code, samp, kbd, var, cite, abbr, acronym, sub,
sup, q, br, ins, del, a, img, object, iframe {
font-family: "ＭＳ Ｐゴシック", "Osaka", "ヒラギノ角ゴ Pro W3", sans-serif;
margin: 0;
padding: 0;
border: 0;
font-style: normal;
font-weight: inherit;
font-size: 100%;
}

a {color: #CC3333;}

a:hover {color:#FF6699;}


li{list-style:none;}

td{text-align:left;}

p{
	margin:10px 0px;
	text-align:left;}



p.tcenter{
	text-align:center;}

h1{
	margin:0px 10px 0px;
	color:#ffffff;
	font-size:12px;
	font-weight:100;
	line-height:1.8em;
	text-align:left;
	}

/*--------------------------------------------------------------------
common
ページ共通部分
--------------------------------------------------------------------*/

/*containerのスタイル*/

#container{
text-align:center;
width:1010px;
background:#FFFFFF;
margin:0px auto;
font-size:12px;
padding:0;
height:100%;
background:url(images/main_bg2.jpg) 0 0 repeat-y;
}

#wrapper{
	width:1000px;
	margin:0 auto;

	}

/* header のスタイル */

#header1{
	background: url(images/header_top.jpg) 0 0 no-repeat;
	height:20px;
	text-align:left;
	line-height:20px;}

#header1 div{ color:#FFFFFF;}

#header2{
	height:82px;
	background:#FFFFFF;
	margin:0 auto;
	padding-left:13px;
	}

.logo{
	width:352px; float:left; margin:10px 25px 0 0;}

.h_navi{
	width:350px; float:left; margin:26px 0 0 0;}
	
.h_tel{
	width:258px; float:left; margin:11px 0 0 0;}


	
/*  #main -----------------------------------------------------------------------------------------------------------------*/

#main{
	width:967px;
	margin:10px auto 0 auto;
	background:#FFFFFF;}


p.pankuzu{
     nargin-top:10px;
     /margin-top:0px;}



/*  #leftカラム -----------------------------------------------------------------------------------------------------------------*/	
	
#left{width:210px; float:left;}


#g-menu{
	background:#E9E9E9;
	padding: 5px;
}

#left li
{
	display: block;
	padding: 0px;
}

#left ul li a:link, #left ul li a:visited
{
	background:url(images/l_menubg.jpg) no-repeat 0 bottom;
	color: #333;
	text-align:left;
	text-decoration: none;
	border:none;
	display: block;
	height:36px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 20px;
	line-height: 36px;
}

#left ul li.page_level_1 a:link, #left ul li.page_level_1 a:visited
{
	background:url(images/l_menubg.jpg) no-repeat 0 bottom;
	color: #333;
	text-align:left;
	text-decoration: none;
	border:none;
	display: block;
	height:36px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 20px;
	line-height: 36px;
	border: 1px solid #CCC;
}

#left ul li.page_level_2 a:link, #left ul li.page_level_2 a:visited
{
	height:25px;
	line-height:25px;
	text-align:left;
	text-indent:15px;
	display: block;
	background-color: #FFFFFF;
	background-image: url(images/gmenu_2.gif);
	background-repeat: no-repeat;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	background-position: 20px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #CCC;
	border-right-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #CCC;
	border-left-color: #CCC;
	padding-bottom: 2px;
}


#left ul li a:hover, #left ul li a:active
{
	display: block;
	color:#CE314E;
}

#left ul li.page_level_1 a:hover, #left ul li.page_level_1 a:active
{
	display: block;
	color:#CE314E;
}

#left ul li.page_level_2 a:hover, #left ul li.page_level_2 a:active
{
	display: block;
	color:#CE314E;
}

#l-favorite{margin:17px 0 21px 0;}

#l-favorite .div1{
	width:210px;
	text-align:left;
	text-indent:2px;
	padding-bottom:4px;
	border-bottom:1px solid #000000;}
	
#l-favorite .div2{
	border-bottom:1px dotted #999999;
	background:url(images/list_mark1.jpg) 2px 13px no-repeat;
	text-align:left;
	text-indent:20px;}

#l-favorite .div2 div a{
	line-height:36px;
	height:36px;
	}

#l-favorite .div2 .div3{background:url(images/icon1.jpg) 190px 13px no-repeat;}

#l-favorite .div2 .div4{background:url(images/icon2.jpg) 190px 13px no-repeat;}
	
#l-favorite .div2 .div5{background:url(images/icon3.jpg) 190px 13px no-repeat;}



/* right (メイン)------------------------------------------------------------------------------------------*/

#right{
	width:725px;
	float:right;}
	
#right .r-box1{
	background:url(images/box1_bg.gif) 0 0  repeat;
	margin:20px 0 0 0;
	padding-top:10px;}



#right .r-box2{
	width:703px;
	margin:0px auto;}

#right .r-box2 .topic0{
	background:#FFFFFF;
	height:400px;}


#right .r-box2 .topic1 .topic2 .topic3{
	width:325px;
	border-bottom:1px dotted #999999;
	margin:0 auto;
	text-align:left;
	}

#right .r-box2 .topic1 .topic2 .topic3 a{
	height:35px;
	line-height:35px;
	}


#right .r-box2 .topic-u{
	background:url(images/rss.jpg) 10px 13px no-repeat;
	text-align:left;
	padding: 5px 0 5px 50px;
}


#right .banner2{
	background:url(images/banner2.jpg) 0 0 no-repeat;
	width:725px;
	height:160px;
	font-size:1px;
	margin:20px 0 0 0;
	position:relative;}
	
#right .banner2 p{text-indent:-9999px;}
	
#right .banner2 div{
	position:absolute;
	left:573px;
	top:123px;}
	
.r-box1 .mobile-sys{
	background:#FFFFFF;
	text-align:left;
	width:344px;
	margin:0 auto
	}
.r-box1 .mobile-sys2{
	width:330px;
	padding:10px 0;
	margin-left:10px;
	}

.mobile-sys,.faq-top{height:160px; background:#FFFFFF;}

.r-box1 .mobile-sys .detail{
	background:url(images/list_mark1.jpg) 0px 6px no-repeat;
	text-indent:15px;
	margin-left:10px;
	margin-top:20px;
	}
	
.r-box1 .faq-top{
	text-align:left; 
	background:#FFFFFF; 
	width:344px; 
	margin:0 auto;}

.r-box1 .faq-top .qa{
	border-bottom:dotted 1px #999999; 
	width:325px; 
	margin-left:10px;}

.r-box1 .faq-top .qa a{ 
	height:40px; 
	line-height:40px; }

.r-box1 .faq-top .detail{
	background:url(images/list_mark1.jpg) no-repeat 10px 6px #FFFFFF;
	text-indent:25px;
	margin-top:5px;
	}

.works{ 
	background-color:#FFFFFF;
	padding:15px 10px 0 10px;
	width:685px;
	}
.works2{ width:185px;}

.works2 p{
	margin:0 0 10px 0;
	line-height:1em;
	}
.works2 .detail{
	font-size:10px;
	line-height:1.5em;
	}
.works2 .detail2{
	background:url(images/list_mark1.jpg) 0 6px no-repeat;
	text-indent:15px;
	}

.post .subttl{
       text-align:left; 
}

/* footer-menuのスタイル -------------------------------------------------------------------------------------------------------------------*/

#footer-menu{height:25px;
padding-left:50px;
background:url(images/mobile.gif) 0 0 no-repeat;
padding-top:20px;
margin-bottom:10px;} 

#footer-menu ul{ width:500px; float:left;}

#footer-menu li{
	float:left;
	margin-right:20px;
	background:url(images/list_mark2.gif) 0 8px no-repeat;
	text-indent:15px;
	}

/* footerのスタイル -------------------------------------------------------------------------------------------------------------------*/

#footer{
	background:url(images/footer-img.jpg) 0 0 no-repeat;
	width:1000px;
	height:170px;
	position: relative;
	}

#footer p.copy{
	color:#FFFFFF;
	font-size:11px;
	margin-top: 110px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 20px;
	}

#footer p.copy a{
	color:#FFFFFF;
	text-decoration:none;}
	
#footer p.txtindent{font-size:1px; text-indent:-9999px;}

#footer .footer_bt{
	position: absolute;
	left:770px;
	top:35px;
	width:210px;}


/*otherのスタイル--------------------------------------------------------------------------------------*/
.hyou td{
	background:url(commonimg/dot623.gif) repeat-x 0 bottom;
	padding:5px 10px 4px;}

.hyou td.tdr{
	background:url(commonimg/dot623.gif) repeat-x 0 0;
	padding:5px 10px 4px;}

	
.hyou .tdl{
	background:url(commonimg/tdl.gif) repeat-x 0 0;
	padding:7px 10px 5px;}
	
.hyou .tdl2{
	background:url(commonimg/tdl.gif) repeat-x 0 0;
	padding:7px 10px 5px;
	text-align:center;}
	
.hyou2 td{
	padding:10px;
	border-right:solid 1px #CCCCCC;
	border-bottom:solid 1px #CCCCCC;}

.hyou2 table{
	border:solid 1px #CCCCCC;
	margin:0 0 20px;}
	
.hyou2 .tdl{
	background:url(commonimg/tdl2.gif) #E1EDC7 repeat-y 0 0;
	padding:7px 10px 5px;}
	
.hyou3 td{
	background:url(commonimg/dot623.gif) repeat-x 0 bottom;
	padding:5px 10px 4px;
	font-size:12px;}

.hyou3 td.tdr{
	background:url(commonimg/dot623.gif) repeat-x 0 0;
	padding:5px 10px 4px;}

	
.hyou3 .tdl{
	background:url(commonimg/tdl.gif) repeat-x 0 0;
	padding:7px 10px 5px;
	text-align:center;}
.hyou3{
	border-bottom:solid 1px #CCCCCC;}


.txtsize{
	width:450px;}
	
.borderpoint{
border-collapse: collapse;
}


.pagetop2{
margin:20px 0px 20px;
line-height:1.0em;
text-align:right;
}

.grayline{
	border:#ADB0BA solid 1px;
	padding:10px 0;
	margin:0 0 18px;}
	





/*fontのスタイル*/


.txtb{
font-weight:bold;
}

.txtblue{
color:#163594;}

.txtwhite{
color:#FFFFFF;}


.txtred{
	color:#FF0000;
}

.txtorange{
	color:#FF3300;}

.txtbred{
color:#FF0000;
font-weight:bold;}

.txtbred2{
color:#CC0000;
font-weight:bold;}



.txt10{
	font-size:10px;}

.txt11{
	font-size:11px;}

.txtgreen14{
	color:#86B612;
	font-size:14px;
	font-weight:bold;}


.txt14{
	font-size:14px;
	font-weight:bold;}
	


.icongreen{
	color:#C2DA88;}


/*float alignのスタイル*/
.fleft{
float:left;
text-align:left;
}

.fright{float:right;}

.tcenter{text-align:center;}
.tleft{text-align:left;}
.tright{text-align:right;}
.tcenter{
	text-align:center;
	vertical-align: top;
}
.clear{clear:both;}
.vtop{vertical-align:top;}
.vmiddle{vertical-align:middle;}


/*margin paddingのスタイル*/

.mc{ margin:0 auto;}

.mt-2{margin:-2px 0 0 0;}
.mt5{margin:5px 0px 0px;}
.mt10{margin:10px 0px 0px;}
.mt15{margin:15px 0px 0px;}
.mt20{margin:20px 0px 0px;}
.mt23{margin:23px 0px 0px;}
.mt25{margin:25px 0px 0px;}
.mt30{margin:30px 0px 0px;}
.mt35{margin:35px 0px 0px;}
.mt37{margin:37px 0px 0px;}
.mt40{margin:40px 0px 0px;}
.mt60{margin:60px 0px 0px;}


.mu1{margin:0px 0px 1px;}
.mu3{margin:0px 0px 3px;}
.mu4{margin:0px 0px 4px;}
.mu5{margin:0px 0px 5px;}
.mu7{margin:0px 0px 7px;}
.mu8{margin:0px 0px 8px;}
.mu10{margin:0px 0px 10px;}
.mu14{margin:0px 0px 14px;}
.mu15{margin:0px 0px 15px;}
.mu20{margin:0px 0px 20px;}
.mu25{margin:0px 0px 25px;}
.mu30{margin:0px 0px 30px;}
.mu40{margin:0px 0px 40px;}
.mu41{margin:0px 0px 41px;}
.mu45{margin:0px 0px 45px;}
.mu50{margin:0px 0px 50px;}
.mu51{margin:0px 0px 51px;}
.mu60{margin:0px 0px 60px;}
.mu70{margin:0px 0px 70px;}
.mu100{margin:0px 0px 100px;}
.mu200{margin:0px 0px 200px;}
.mu500{margin:0px 0px 500px;}
.mu10r14{margin:0px 14px 10px 0px;}

.ml10{margin-left:10px;}
.ml20{margin-left:20px;}


.mlr15{margin:0 15px 0 15px;}

.mtu10{
	margin:10px 0px;}

.mr4{
	margin-right:4px;}
	
.mr5{
	margin-right:5px;}

.mr10{
	margin-right:10px;}
	
.mr15{
	margin-right:15px;}
	
.mr17{
	margin-right:17px;}
	
.mr20{
	margin-right:20px;}

.mr30{
	margin-right:30px;}	

.mr32{
	margin-right:32px;}	



.mr50{
	margin-right:50px;}	

.mr62{
	margin-right:62px;}	
	
.pdb10{ padding-bottom:10px;}

/*widthのスタイル*/
.w76r{ width:76px; float:right;}
.w86l{ width:86px; float:left;}
.w108r{ width:108px; float:right;}
.w200{ width:200px;}
.w231r{ width:231px; float:right;}
.w258l{ width:258px; float:left;}
.w329l{ width:329px; float:left;}
.w300l{ width:300px; float:left;}

.w346l{ width:346px; float:left;}
.w346r{ width:346px; float:right;}

.w682{ width:682px;}

/* 以下はサブコーディング時に作成したスタイルです。　稲富 */

#sub_main{
	width:967px;
	margin:10px auto 0 auto;
	/*background:url(../commonimg/main_bg.gif) 0 0 repeat;*/}

.pan{
	text-align:left;
	margin:10px 0 0 20px;}

.subpage *{
	text-align:left;}

h2{
	font-size:20px;
	font-weight:bold;
	text-indent:10px;
	border-left:4px solid #D43452;
	margin-bottom:7px;}

.h2_out{
       margin-top:-8px;
}

h2.h2news{
	font-size:20px;
	font-weight:bold;
	text-indent:10px;
	border-left:4px solid #D43452;
	margin-bottom:7px;
text-align:left;}

h3{
	font-weight:bold;
	font-size:16px;
	text-indent:20px;
	width:705px;
	background:url(images/maru.jpg) 0 9px no-repeat;
	margin:0 auto 20px auto;
	border-bottom:3px solid #cccccc;}

.marubox_middle{
	background:#E9E9E9;
	width:705px;
	margin:0 auto 0 auto;
	margin-bottom:30px;
	text-align:center;
	}
.marubox_middle li{
	text-indent:10px;
	list-style:disc; list-style-position:inside;
	margin-left:10px;}

.marubox_middle .indent_back{
	text-indent:-1em;
	margin-left:30px;}
	
.cmsimg{
	width:703px;
	height:427px;
	background:url(images/about/img3.jpg) 0 0 no-repeat;
	margin:20px auto 20px auto;
	position:relative;}
	
.cmsimg div{
	position:absolute;
	top:375px;
	left:250px;}

.cms_footbt{
	width:704px;
	margin:0 auto;}
	
/* planスタイル */

.plan_contact{
	width:705px;
	height:59px;
	background:url(images/plan/common/contact.jpg) 0 0 no-repeat;
	margin:0 auto 40px auto;
	position:relative;
	}

.plan_contact div{
	position:absolute;
	top:7px;
	left:482px;
}


/* マーケティングコンサルティング  */

.marubox_middle2{
	background:#F9EDEC;
	width:705px;
	margin:0 auto;}

.marubox_middle2 li{
	list-style:inside;
	list-style-type:disc;
	float:left;
	margin-right:30px;}
	
.line{
	margin:30px auto 30px auto;
	width:702px;
	}


/* 制作実績のスタイル */

.works_r{
	margin-left:350px;}
	

/* よくある質問のスタイル */



.section h4{
	width:705px;
	height:42px;
	line-height:42px;
	background:url(images/qa/q_box.jpg) 0 0 no-repeat;
	font-weight:bold;
	text-indent:40px;
        cursor:pointer;
	}

.section h4 a{
        height:42px;
	line-height:42px;
        }
.section p{
	display:none;}

.section p{
	background:#F9EDEC url(images/qa/a.jpg) 12px 20px no-repeat;
	padding:15px 10px 10px 40px;
	margin:0;
	}
	
/* 会社概要のスタイル */

.company{
	width:710px;
	margin:20px auto 20px;
	border-top:1px dotted #CCCCCC;
	border-bottom:1px dotted #CCCCCC;
	}

.company table{ margin:5px 0;}

.company td{
	padding:10px;
	border-bottom:1px dotted #CCCCCC;
	}

.company .last_td{ border:none;}

.company table p{
	margin:0;
	padding:5px 0 5px 10px;
	border-left:4px solid #CCCCCC;
	
	}

.company .td_l{padding-left:0px;}


/* お問い合わせのスタイル */

form.contact_form{display:inline;}

form.contact_form input{ vertical-align:middle;}

form.contact_form  textarea{
	width:500px;
	height:230px;}


/* サイトマップのスタイル */

.mapbox a{
	background:url(images/sitemap/sitemap_box.gif) 0 0 no-repeat;
	width:340px;
	height:30px;
	line-height:30px;
	text-indent:25px;
	font-weight:bold;
	display:block;
	text-decoration:none;
	}

.mapbox_sub{text-indent:20px;}



/* widthのスタイル２ */

.w24l{
	width:24px;
	float:left;
	margin:10px 15px 0 15px;}

.w101l{
      width:101px;
      float:left;
      }

.w222{
      width:222px;
      margin:0 auto;
}

.w101r{
      width:101px;
      float:right;
      }

.w255l{
	width:255px;
	float:left;}

.w290r{
	width:290px;
	float:right;}
	
.w310l{
	float:left;
	width:310px;}

.w320r{
	float:rigth;
	width:310px;}


.w340l{
	float:left;
	width:340px;}

.w340r{
	float:right;
	width:340px;}

.w384r{
	width:384px;
	float:right;
	}

.w402l{
	width:402px;
	float:left;}
	
.w500l{
	width:500px;
	float:left;
	}
.w608{
	width:608px;
	margin:0 auto;}	

	
.w665{
	width:665px;
	margin:0 auto;}	
	
.w690{
	width:690px;
	margin:0 auto;}

.w703{
	width:703px;
	margin:0 auto;}
	

.w705{
	width:705px;
	margin:0 auto;}
	
.w710{
	width:710px;
	margin:0 auto;}
	
/* marginのスタイル */

.mr7{
	margin-right:7px;}
.mt7{
	margin-top:7px;}
	
	
/* フォントのスタイル */

.txtbred16{
	font-size:16px;
	color:#C62D49;
	font-weight:bold;
}

/* 制作実績 */
.line_b{
	border-bottom:1px dotted #CCCCCC;
	margin:30px auto 30px auto;}



/* お手本サイトのポップアップウィンドウのスタイル  */
html.model{
min-height: 100%;
height: 100%;
overflow-y: scroll;
}

body.model{
min-height: 100%;
height: 100%;
overflow-y: scroll;
}

*html.model,*body.model{
overflow-y:visible;}