@charset "utf-8";


body,p,h1,h2,h3{
	margin:0;
	padding:0;
}


body{
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	font-size:14px;
	line-height:200%;
	background-color:#f6f6f6;
	overflow-x:hidden;
	color:#292929;
}


/*ヘッダー背景*/


#header{
	background-image:url(../img/back.jpg);
	background-position:top center;
	background-size:cover;
	background-attachment:fixed;
	height:100vh;
	position:relative;
}


.nav_box{
	background-color:rgba(255,255,255,0.5);
	width:100%;
	height:50px;
	padding:10px 0;
	position:fixed;
	border-top:5px solid #28b999;
	z-index:1;
}



/*ロゴ*/


#header h1{
	background-image:url(../img/logo.png);
	width:161px;
	height:51px;
	text-indent:-9999px;
	margin-left:40px;
	float:left;
}





/*メニュー*/

.dorawer{
	display:none;
}

.nav{
	width:726px;
	margin-right:20px;
	float:right;
}


.nav ul{
	list-style-type:none;
	margin:0;
	padding:0;	
}


.nav ul li{
	float:left;
	padding:20px 20px;
}


.nav ul li a{
	display:block;
	background-image:url(../img/nav.png);
	height:14px;
	text-indent:-9999px;
}


.nav_1 a{
	background-position:0 0;
	width:80px;
}

.nav_2 a{
	background-position:-88px 0;
	width:124px;
}

.nav_3 a{
	background-position:-219px 0;
	width:105px;
}

.nav_4 a{
	background-position:-331px 0;
	width:98px;
}

.nav_5 a{
	background-position:-436px 0;
	width:119px;
}


.nav_1 a:hover{
	background-position:0 -15px;
	width:80px;
}

.nav_2 a:hover{
	background-position:-88px -15px;
	width:124px;
}

.nav_3 a:hover{
	background-position:-219px -15px;
	width:105px;
}

.nav_4 a:hover{
	background-position:-331px -15px;
	width:98px;
}

.nav_5 a:hover{
	background-position:-436px -15px;
	width:119px;
}




/*キャッチコピー*/


.catchcopy{
	width:610px;
	height:320px;
	position:absolute;
	right:0;
	left:0;
	top:0;
	bottom:0;
	margin:auto;
}


.catchcopy h2{
	background-image:url(../img/catchcopy.png);
	width:610px;
	height:39px;
	text-indent:-9999px;
}


.catchcopy_box{
	margin-top:40px;
	padding:40px;
	line-height:300%;
	text-align:center;
	color:#FFFFFF;
	font-size:20px;
	font-weight:bold;
	background-color:rgba(0,0,0,0.4);
}















#main{
	width:900px;
	margin:0 auto;
}



/*ニュース*/

.news{
	width:750px;
	margin:0 auto;
	padding:50px 0;
}

.news h2{
	background-image:url(../img/news.png);
	width:242px;
	height:139px;
	margin:0;
	padding:0;
	text-indent:-9999px;
}


.news_box{
	border-bottom:1px solid #CBCBCB;
	padding:10px 0;
	margin-top:30px;
	margin-bottom:30px;
}


.date{
	color:#28b999;
	font-weight:bold;
}

.news_link_button a{
	display:block;
	width:200px;
	text-align:center;
	padding:10px;
	border:1px solid #28b999;
	color:#28b999;
	text-decoration:none;
	float:right;
}

.news_link_button a:hover{
	background-color:#28b999;
	border:1px solid #28b999;
	color:#f6f6f6;
}





/*サービス*/

.service{
	width:750px;
	margin:0 auto;
	padding:100px 0;
}


.service h2{
	background-image:url(../img/service.png);
	width:312px;
	height:139px;
	text-indent:-9999px;
}



/*サービスコンセプト*/

.service_concept{
	width:650px;
	margin:0 auto;
	margin-top:50px;
}


.first img,.second img,.third img{
	display:block;
	margin:0 auto;
}


.first{
	width:650px;
	margin:0 auto;
	margin-bottom:50px;
}

.service_box_1{
	width:260px;
	float:left;
}

.service_box_2{
	width:260px;
	float:right;
}


.second{
	width:580px;
	float:left;
	margin-bottom:50px;
}

.service_box_3{
	width:260px;
	float:left;
}

.service_box_4{
	width:260px;
	float:right;
}


.third{
	width:260px;
	float:right;
	margin-bottom:50px;
}

.service_box_5{
	width:260px;
}




/*BOX内のH3*/

.service_box_1 h3{
	background-image:url(../img/seo.png);
	width:192px;
	height:43px;
	text-indent:-9999px;
	margin:0 auto;
}

.service_box_2 h3{
	background-image:url(../img/productlistingads.png);
	width:192px;
	height:43px;
	text-indent:-9999px;
	margin:0 auto;
}

.service_box_3 h3{
	background-image:url(../img/mediaconsutraction.png);
	width:192px;
	height:43px;
	text-indent:-9999px;
	margin:0 auto;
}

.service_box_4 h3{
	background-image:url(../img/mailmarketing.png);
	width:192px;
	height:43px;
	text-indent:-9999px;
	margin:0 auto;
}

.service_box_5 h3{
	background-image:url(../img/consulting.png);
	width:192px;
	height:43px;
	text-indent:-9999px;
	margin:0 auto;
}


/*BOX内のテキスト*/

.service_text{
	padding:20px 0;
	text-align:center;
}




/*works*/

.works{
	padding:100px 0;
	margin-bottom:80px;
}


.works h2{
	background-image:url(../img/works.png);
	background-repeat:no-repeat;
	width:750px;
	height:140px;
	margin:0 auto;
	text-indent:-9999px;
	margin-bottom:50px;
}


/*works box1*/

.works_box_1{
	background-color:#28b999;
	width:280px;
	height:455px;
	padding:30px 0;
	float:left;
	margin-right:30px;
}


.works_box_1 h3{
	background-image:url(../img/works_01.png);
	width:185px;
	height:164px;
	text-indent:-9999px;
	margin:0 auto;
}


.works_box_1 a{
	font-weight:bold;
	font-size:19px;
	color:#292929;
	text-decoration:none;
}


.works_box_1 a:hover{
	color:#FFFFFF;
}




/*works box2*/

.works_box_2{
	background-color:#28b999;
	width:280px;
	height:455px;
	padding:30px 0;
	float:left;
}


.works_box_2 h3{
	background-image:url(../img/works_02.png);
	width:185px;
	height:164px;
	text-indent:-9999px;
	margin:0 auto;
}


/*works box3*/

.works_box_3{
	background-color:#28b999;
	width:280px;
	height:455px;
	padding:30px 0;
	float:right;
}

.works_box_3 h3{
	background-image:url(../img/works_03.png);
	width:185px;
	height:164px;
	text-indent:-9999px;
	margin:0 auto;
}


/*works text*/

.works_text{
	width:230px;
	height:180px;
	margin:0 auto;
	padding:30px 0;
}



/*LINK ボタン*/

.works_link_button a{
	display:block;
	background-image:url(../img/link_button.png);
	width:230px;
	height:50px;
	text-indent:-9999px;
	margin:0 auto;
}

.works_link_button a:hover{
	background-image:url(../img/link_button_hover.png);
}







/*about*/

.about{
	background-image:url(../img/about_back.jpg);
	background-attachment:fixed;
	background-size:cover;
	color:#FFFFFF;
	text-align:center;
	height:100vh;
	line-height:300%;
	font-size:20px;
	font-weight:bold;
	text-shadow:4px 2px 14px #828282;
	position:relative;
	z-index:0;
}


.about h2{
	background-image:url(../img/aboutus.png);
	width:292px;
	height:32px;
	text-indent:-9999px;
	margin:0 auto;
	margin-bottom:50px;
}


.about_box{
	width:750px;
	height:300px;
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	margin:auto;
}







#footer{
	background-color:#292929;
	color:#FFFFFF;
	padding:150px 0;
}



/*コンタクトフォーム*/

.footer_box{
	width:600px;
	margin:0 auto;
}

.contact{
	width:263px;
	float:left;
}

.contact h2{
	background-image:url(../img/ourcontact.png);
	width:263px;
	height:140px;
	text-indent:-9999px;
}


form p{
	padding:10px 0;
}


input,textarea{
	width:100%;
}





/*インフォメーション*/

.infomation{
	width:200px;
	float:right;
}

.infomation h2{
	background-image:url(../img/infomation.png);
	width:200px;
	height:140px;
	text-indent:-9999px;
	margin-bottom:10px;
}


.infomation p{
	line-height:250%;
	text-align:right;
}






/*コピーライト*/

.copylight{
	background-color:#28b999;
	color:#FFFFFF;
	text-align:center;
	padding:20px;
	font-size:12px;
}










/*よくつかうクラス*/



.clear{
	clear:both;
}