@charset "utf-8";

/********** Common **********/
#wrapper{
	width:1100px;
	margin:0 auto;
}

#contents{
	width:1000px;
	margin:40px auto;
}

@media screen and (max-width: 1099px){
#wrapper{
	width:100%;
	margin:0 auto;
}
}

@media screen and (max-width: 999px){
#contents{
	width:98%;
	margin:0 1%;
}
}


/********** Header **********/
#header{
	position:relative;
	margin-bottom:45px;
}

#header h1{
	position:absolute;
	width:20%;
	top:0;
	margin:0 40%;
}

#header h1 img{
	width:100%;
	height:auto;
}

#header img{
	max-width:1100px;
	width:100%;
	height:auto;
}


/********** 広告について **********/
#contents #Block01 h2{
	color:#956110;
	font-size:24px;
	line-height:150%;
	text-align:center;
	margin-bottom:20px;
}

#contents #Block01 .clearfix{
	margin-left:-20px;
}

#contents #Block01 .designBox{
	float:left;
	background:url(../images/design_bg.png);
	width:235px;
	margin:0 0 20px 20px;
	padding:20px 0;
}

#contents #Block01 .designBox img{
	width:100%;
	height:auto;
}

#contents #Block01 .designBox h3{
	padding:0 20px;
	margin-bottom:20px;
	font-size:24px;
	font-weight:bold;
	color:#ffffff;
	text-align:center;
}

#contents #Block01 .designBox p{
	padding:0 20px;
	margin-top:20px;
	text-align:center;
	font-size:14px;
	line-height:150%;
}

@media screen and (max-width: 640px){
	#contents #Block01 .designBox h3{
	padding:0 20px;
	margin-bottom:20px;
	font-size:22px;
	font-weight:bold;
	color:#ffffff;
	text-align:center;
}

#contents #Block01 .designBox p{
	padding:0 15px;
	margin-top:20px;
	text-align:center;
	font-size:12px;
	line-height:150%;
}
}


@media screen and (max-width: 999px){
#contents .clearfix{
	margin-left:-2%;
}
	
#contents #Block01 .designBox{
	float:left;
	background:url(../images/design_bg.png);
	width:48%;
	margin:0 0 2% 2%;
	padding:20px 0;
}
}



/*******ホームページ制作プラン*******/
#contents #hpWrap{
	margin:70px 0;
}

#contents #hpWrap h3{
	background:url(../images/plan_ttl.gif) no-repeat;
	text-indent:-9999px;
	height:63px;
	width:1000px;
}

#contents #hpWrap h4{
	background:url(../images/plan_key.gif) no-repeat;
	text-indent:-9999px;
	height:94px;
	width:1000px;
}

#contents #hpWrap #hpBase{
	position:relative;
	height:763px;
	width:1000px;
}

#contents #hpWrap #hpBase em#hpTxt01{
	position:absolute;
	height:110px;
	width:759px;
	top:395px;
	left:30px;
	background:url(../images/plan_txt.png) no-repeat;
	text-indent:-9999px;
}

#contents #hpWrap #hpBase em#hpTxt02{
	position:absolute;
	height:199px;
	width:254px;
	top:313px;
	left:749px;
	z-index:10;
	background:url(../images/plan_type.png) no-repeat;
	text-indent:-9999px;
}

#contents #hpWrap #hpBase p.hpTel{
	position:absolute;
	text-align:center;
	top:525px;
	left:0px;
	display:block;
	width:1000px;
}

#contents #hpWrap #hpBase p.hpBtn{
	position:absolute;
	text-align:center;
	top:620px;
	left:0px;
	display:block;
	width:1000px;
}

#contents #hpWrap .displaySP img{
	width:100%;
	height:auto;
}
	
	
/*******シュフー*******/
#contents #shWrap{
	margin:70px 0;
}

/***** 普通のシュフー *****/
#contents #shWrap #shufoo01 h3{
	background:url(../images/shufoo_title.png) no-repeat;
	text-indent:-9999px;
	height:156px;
	width:1000px;
}

#contents #shWrap #shufoo01 ul li{
	float:left;
	text-indent:-9999px;
	height:328px;
}

#contents #shWrap #shufoo01 ul li#sh01{
	width:355px;
	background:url(../images/shufoo_01.gif) no-repeat;
}

#contents #shWrap #shufoo01 ul li#sh02{
	width:290px;
	background:url(../images/shufoo_02.gif) no-repeat;
}

#contents #shWrap #shufoo01 ul li#sh03{
	width:355px;
	background:url(../images/shufoo_03.gif) no-repeat;
}

#contents #shWrap #shufoo01 p.tel{
	display:block;
	text-indent:-9999px;
	width:1000px;
	height:89px;
	background:url(../images/shufoo_tel.gif) no-repeat center center;
}

#contents #shWrap #shufoo01 #shBg{
	background:url(../images/shufoo_base.gif) no-repeat;
	width:1000px;
	height:242px;
	text-align:center;
}

/***** パチンコシュフー *****/
#contents #shWrap #shufoo02 h3{
	background:url(../images/shufoo02_title.gif) no-repeat;
	text-indent:-9999px;
	height:135px;
	width:1000px;
}

#contents #shWrap #shufoo02 #sh02Bg{
	background:url(../images/shufoo02_base.jpg) no-repeat;
	width:1000px;
	height:495px;
	text-align:left;
}

#contents #shWrap #shufoo02 ul li{
	height:251px;
	float:left;
	text-indent:-9999px;
}

#contents #shWrap #shufoo02 ul li#sh02_01{
	background:url(../images/shufoo02_01.gif) no-repeat;
	width:260px;
}

#contents #shWrap #shufoo02 ul li#sh02_02{
	background:url(../images/shufoo02_02.gif) no-repeat;
	width:234px;
}

#contents #shWrap #shufoo02 ul li#sh02_03{
	background:url(../images/shufoo02_03.gif) no-repeat;
	width:234px;
}

#contents #shWrap #shufoo02 p{
	margin-left:30px;
	width:689px;
}

#contents #shWrap #shufoo02 p.tel{
	background:url(../images/shufoo02_tel.png) no-repeat;
	height:105px;
	text-indent:-9999px;
}



#contents #shWrap .displaySP img{
	width:100%;
	height:auto;
}
	

/*********** 会社概要 **********/
div#Block02{
	text-align:center;
	padding:80px 0;
	width:100%;
}

div#Block02 .section01{
	width:100%;
}

div#Block02 .section01 h3{
	width:100%;
	height:25px;
	background:url(../images/title_01.png) no-repeat left top;
	overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
	border-bottom:#A6A6A6 dotted 1px;
	margin:0 0 10px 0;
	padding:0 0 10px 0;
}

div#Block02 .section01 h4{
	font-size:16px;
	text-align:left;
	color:#5b5b5b;
	margin-bottom:45px;
}

div#Block02 .section01 #comLeft dl{
	border-bottom:1px dotted #b3b3b3;
	padding:0 2% 10px 2%;
	margin-bottom:10px;
	text-align:left;
	width:96%;
}

div#Block02 .section01 #comLeft dl dt{
	width:20%;
	float:left;
	color:#000000;
}

div#Block02 .section01 #comLeft dl dd{
	width:80%;
	float:right;
	color:#5b5b5b;
}

div#Block02 .section01 #comRight{
	text-align:center;
	margin-left:40px;
}

div#Block02 .section01 #comLeft,
div#Block02 .section01 #comRight{
	width:480px;
	float:left;
}

div#Block02 .section01 #comRight iframe{
	width:480px;
	height:350px;}

@media screen and (max-width: 999px){
div#Block02 .section01 #comLeft dl{
	border-bottom:1px dotted #b3b3b3;
	padding:0 2% 10px 2%;
	margin-bottom:10px;
	margin-left:0;
	text-align:left;
	
}

div#Block02 .section01 #comLeft dl dt{
	width:18%;
	float:left;
	margin-left:2%;
	color:#000000;
}


div#Block02 .section01 #comLeft dl dd{
	width:80%;
	float:right;
	color:#5b5b5b;
}

div#Block02 .section01 #comRight{
	text-align:center;
	margin-left:40px;
}
	
div#Block02 .section01 #comLeft,
div#Block02 .section01 #comRight{
	width:98%;
	float:none !important;
	margin:0 1% 0 2% !important;
}

div#Block02 .section01 #comRight iframe{
	width:100%;
	height:450px;
	margin:0 !important;
}
}



/*********** お問い合わせ **********/
div#Block03{
	text-align:center;
	padding:80px 0;
	width:100%;
}


div#Block03 .section01 h3{
	width:100%;
	height:25px;
	background:url(../images/title_02.png) no-repeat left top;
	overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
	border-bottom:#A6A6A6 dotted 1px;
	margin:0 0 10px 0;
	padding:0 0 10px 0;
}

div#Block03 .section01 h4{
	font-size:16px;
	text-align:left;
	color:#5b5b5b;
	margin-bottom:45px;
}

div#Block03 .section01 address{
	text-align:center;
	margin-bottom:30px;
}

div#Block03 .section01 address span.txt01{
	font-size:16px;
	padding-bottom:5px;
	border-bottom:3px double #A6A6A6;
	display:inline-block;
}

div#Block03 .section01 address .txt02{
	font-size:50px;
	font-weight:bold;
	padding:20px 0 20px 50px;
	color:#2b69d4;
	background:url(../images/icon_tel.png) no-repeat left;
	display:inline-block;
}

@media screen and (max-width: 640px){
div#Block03 .section01 address .txt02{
	font-size:35px;
	line-height:140%;
	font-weight:bold;
	padding:20px 0 20px 50px;
	color:#2b69d4;
	background:url(../images/icon_tel.png) no-repeat left;
	display:inline-block;
}
}

div#Block03 .section01 address span.txt03{
	font-size:16px;
	padding-bottom:5px;
	display:inline-block;
}

div#Block03 .section01 div#mailWrap{
	background:#ffffff;
	padding:30px 10px;
}

div#Block03 .section01 div#mailBox{
	width:100%;
	max-width:540px;
	margin:0 auto;
}

form#mailformpro dl dt {
	float: left;
	width: 150px;
	padding: 10px 0px;
	text-align:left;
	margin: 0px;
}
form#mailformpro dl dd {
	float:left;
	margin: 0px;
	padding: 10px 0;
	line-height: 1.5em;
	text-align: left;
	width:390px;
}

form#mailformpro dl dd input{
	width:50%;
	border:1px solid #b3b3b3;
	height:20px;
	font-size:14px;
}

form#mailformpro dl dd textarea{
	width:100%;
	border:1px solid #b3b3b3;
	font-size:14px;
}

div#Block03 .section01 button,.mfp_element_reset{
	font-size:14px;
	width:88px;
	height:36px;
	cursor:pointer;
	overflow: hidden;
    text-indent: -9999px;
    white-space: nowrap;
	border:none;
}

div#Block03 .section01 button:hover{
filter:alpha(opacity=50); /*IE*/
-moz-opacity:0.50; /*FF*/
opacity:0.50;
}

div#Block03 .section01 button#btnSubmit,.mfp_element_reset{
	background:url(../images/btn_send.gif) no-repeat;
}

div#Block03 .section01 button#btnReset{
	background:url(../images/btn_riset.gif) no-repeat;
}

@media screen and (max-width: 999px){
form#mailformpro dl dt {
	float:none;
	width: 94%;
	text-align:left;
	padding:0;
	margin: 0 3%;
}
form#mailformpro dl dd {
	float:none;
	margin: 0 3%;
	padding: 5px 0 10px 0;
	line-height: 0em;
	text-align: left;
	width:94%;
}

form#mailformpro dl dd input{
	width:100%;
	border:1px solid #b3b3b3;
}

form#mailformpro dl dd textarea{
	width:100%;
	border:1px solid #b3b3b3;
}
}


/********** Footer **********/
#footer{
	background:url(../images/ftr_img.png) no-repeat top center;
	width:100%;
	padding-top:56px;
}

#footer small{
	width:100%;
	padding:10px 0;
	text-align:center;
	color:#b7b7b7;
	border-top:3px double #b7b7b7;
	font-size:12px;
	display:block;
}



/*******Thanks*******/
#thanksImg img{
	max-width:475px;
	width:100%;
	height:auto;
}