.cbp-af-header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 20000;
	overflow: hidden;
	/*font-family: 'Roboto Condensed', sans-serif;*/
}

.cbp-af-inner {
	-webkit-transition: height 0.3s ease-in-out;
	-moz-transition: height 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}


/*----------------------------------
縮小前の設定
※ここでは、枠の設定を行う
----------------------------------- */

/*div */
.cbp-af-header .cbp-af-inner {
	width:1240px;
	margin:0 auto;
	background:#fff;
	height: 242px;
	overflow: hidden;
}


/*----------------------------------
BOX設定
※こちらは各ボックスの基本設定
----------------------------------- */


.cbp-af-header h1{
float: left;
height:242px;
width:310px;
display:block;
font-size: 200%;

}

.cbp-af-header .hd2_box{
float: left;
width:310px;
height:242px;
display:block;
font-size: 30pt;

}

.cbp-af-header .hd2_box2{
    float: left;
    width: 310px;
    height: 242px;
    display: block;
    font-size: 14pt;
    font-weight: bold;
}
.cbp-af-header .hd2_box3{
float: left;
width:0px;
height:0px;
display:block;
font-size: 30pt;

}

.cbp-af-header nav{
float: left;
height:242px;
width:310px;
display:block;
background-color:#fff;
}

.cbp-af-header .hd4_box{
float: left;
height:242px;
width:310px;
display:block;
}


/*----------------------------------
ボックス内設定
----------------------------------- */

.cbp-af-header h1 img{
width:100%;
height:100%;
}

.hd2_box h2{
letter-spacing:0.04em;
color:#fff;
font-weight:normal;
}

.cbp-af-header .hd4_box img{
width:100%;
height:100%;
}

/*----------------------------------
h2文字の位置設定
---------------------------------- */

.low1{
margin:200px 0 0 15px;
}

.low2{
margin:160px 0 0 15px;
}


/*----------------------------------
各ページの背景画像指定
---------------------------------- */

.cbp-af-header .hbk1{
background-image: url("../img/header/slogan.jpg");
background-repeat: no-repeat;
}
.cbp-af-header .hbk10{
    background-color: #e9e9e8;
}

.cbp-af-header .hbk2{
background-image: url("../img/idea/title_idea.jpg");
background-repeat: no-repeat;
}

.cbp-af-header .hbk3{
background-image: url("../img/company/title_company.jpg");
background-repeat: no-repeat;
}

.cbp-af-header .hbk4{
background-image: url("../img/work/title_work.jpg");
background-repeat: no-repeat;
}

.cbp-af-header .hbk5{
background-image: url("../img/header/h2_5.gif");
background-repeat: no-repeat;
}

.cbp-af-header .hbk6{
background-image: url("../img/header/h2_6.gif");
background-repeat: no-repeat;
}

.cbp-af-header .hbk7{
background-image: url("../img/header/h2_7.gif");
background-repeat: no-repeat;
}


.cbp-af-header .hbk8{
background-image: url("../img/interview/title_interview.jpg");
background-repeat: no-repeat;
}

.cbp-af-header .hbk9{
background-image: url("../img/interview/title_interview_red.jpg");
background-repeat: no-repeat;
}


/*----------------------------------
各ページのセレクト色
---------------------------------- */

.cbp-af-header nav ul li a.selected-2{
	color:#a8ca01;
}

.cbp-af-header nav ul li a.selected-3{
	color:#f74b4a;
}

.cbp-af-header nav ul li a.selected-4{
	color:#4fb0c3;
}

.cbp-af-header nav ul li a.selected-5{
	color:#542d32;
}

.cbp-af-header nav ul li a.selected-6{
	color:#f9c100;
}

/*----------------------------------
ナビゲーションボタン設定
---------------------------------- */

.cbp-af-header nav ul {
margin:60px 0 0 20px;
}

.cbp-af-header nav li {
margin:0 0 8px 0;
}

.cbp-af-header nav li.h_nav_top {
margin:15px 0 65px 0;
}

.cbp-af-header nav ul li a {
	font-size: 100%;
	text-decoration:none;
	color:#888;
	font:normal 12px "メイリオ", "Verdana", "Geneva", "sans-serif";
}

.cbp-af-header nav a:hover {
	color: #B3B3B3;
}



/*----------------------------------
文字のアニメーション（往復）
---------------------------------- */

.cbp-af-header h1,
.cbp-af-header nav,
.cbp-af-header .cbp-af-inner .hd4_box{
	-webkit-transition: height 0.3s ease-in-out;
	-moz-transition: height 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

/*----------------------------------
縮小後の設定
-----------------------------------*/

/*div */
.cbp-af-header.cbp-af-header-shrink .cbp-af-inner {
	height:50px;
	background:#262626;
	color:#fff;
}

/*縮小後に非表示の要素設定 */

.cbp-af-header.cbp-af-header-shrink  .hd2_box{
width:0px;
height:0px;
opacity: 0;
}
 .hd2_box2  hbk11{
width:10px;
height:30px;
opacity: 0;
}

.cbp-af-header.cbp-af-header-shrink  .hd2_box2  hbk11{
width:50;
height:50;
opacity: 0;
}
.cbp-af-header.cbp-af-header-shrink  .hd2_box3{
width:200px;
height:50px;
background-image: url("../img/header/name.jpg");
}

.cbp-af-header.cbp-af-header-shrink .cbp-af-inner .hd4_box{
width:0;
height:0;
opacity: 0;
}

.cbp-af-header.cbp-af-header-shrink .cbp-af-inner .hd5_box{
width:100px;
height:50px;
font-size:30%;
color:#fff;
}


/*　h1 */
/*.cbp-af-header.cbp-af-header-shrink h1{
	height:50px;
	width:75px;

}
 */
.cbp-af-header.cbp-af-header-shrink h1{
	height:0px;
	width:0px;

}
.cbp-af-header.cbp-af-header-shrink h1 img {
	font-size: 150%;
}

/*nav */
.cbp-af-header.cbp-af-header-shrink nav {
	height:50px;
	width:1039px;
	background:#2c2d2c;
	margin:0;
	font-size:80%;
	/*font-size:60%;*/
}

.cbp-af-header.cbp-af-header-shrink nav ul {
margin:0;
}

.cbp-af-header.cbp-af-header-shrink nav ul li {
float:left;
padding:15px 10px 15px 15px;
color: #ccc;
}


.cbp-af-header.cbp-af-header-shrink nav li.h_nav_top {
margin:0 40px 0 0;
}

.cbp-af-header.cbp-af-header-shrink nav a{
color:#ccc;
padding:0 15px;
display:block;
line-height:20px;
/*font:normal 14px Verdana, Geneva, sans-serif;*/
font-family: "メイリオ", Verdana, Geneva, sans-serif;
}

.cbp-af-header.cbp-af-header-shrink nav a:hover{
background-color:#000;
}

.cbp-af-header.cbp-af-header-shrink  .hd2_box2  hbk10{
height:50px;
width:80px;
}


/*----------------------------------
レスポンシブ用
-----------------------------------*/

/* 1280px以下用 */

@media print, screen and (max-width : 1279px) 
{
	.cbp-af-header {
		overflow:visible;
	}
	.cbp-af-header .cbp-af-inner {
		/*width: 960px;*/
		/*overflow:visible;*/
	}

	.cbp-af-header.cbp-af-header-shrink  .hd2_box{
		width:auto;
		height:auto;
	}
	.cbp-af-header .hd4_box{
		opacity:0;
	}


}


/* 960px以下用 */

@media screen and (max-width : 959px) 
 {

	.cbp-af-header .cbp-af-inner {
		/*width: 640px;*/
		/*height: 300px;*/
	}
	.cbp-af-header.cbp-af-header-shrink  .hd2_box{
		width:auto;
		height:auto;
	}

	/*nav */

/*
	.cbp-af-header nav {
		float: left;
		height:50px;
		width:640px;
		background-color:#fff;
		border-top: 1px solid #e6e6e6; 
		margin:0;
		padding:0;
	}
*/
/*
	.cbp-af-header nav ul{
		margin:0 0 0 10px;
	}
*/
/*
	.cbp-af-header nav li.h_nav_top {
		margin:0;
	}
*/
/*
	.cbp-af-header nav ul li a{
		margin:0;
		padding:7px 10px;
		float:left;
		display:block;
	}
*/
	.cbp-af-header .hd4_box{
		opacity:0;
	}



	/* 縮小後  */

	/*nav */

	.cbp-af-header.cbp-af-header-shrink nav {
		height:50px;
		width:900px;
		/*width:560px;*/
		background:#262626;
		border-top: 0 solid #e6e6e6; 
		margin:0;
		padding:0;
	}

	.cbp-af-header.cbp-af-header-shrink nav li.h_nav_top {
		margin: 0;
	}

	.cbp-af-header.cbp-af-header-shrink nav ul {
		margin:0;
	}

	.cbp-af-header.cbp-af-header-shrink nav ul li a {
		margin:0;
		/*padding:0 8px;*/
		display:block;
		/*line-height:50px;*/
		line-height:20px;
	}

	.cbp-af-header.cbp-af-header-shrink nav a:hover{
		background-color:#000;
	}



}