https://teratail.com/questions/25429

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<div id="top">
    <div class="container">
    <!--- ヘッダーここから -->
    <header>
      <div class="navigation">
          <h1><a href=index.php class="logo">インターンシップ</a></h1>
          <div class="logincontainer">
            <div class="header_login">
              <a  href="login.php" type="button" class="btn btn-primary">ログイン</a>
            </div>
            <div class="header_logout">
              <a href="logout.php" type="button" class="btn btn-danger">ログアウト</a>
            </div>
          </div>
      </div>
      
      <h2>職業体験したい人と働く姿を見てから採用したい企業のマッチングサービス</h2>
    </header>

    <nav class="navbar navbar-default">
        <div class="container-fluid">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbarEexample4">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>

            </div>

            <div class="collapse navbar-collapse" id="navbarEexample4">
                <ul class="nav navbar-nav">
                    <li><a href="index.php">HOME</a></li>
            <li><a href="firstcontact.php">初めての方</a></li>
                    <li><a href="search.php">会社を探す</a></li>
                    <li><a href="c_regist.php">掲載をお考えの方</a></li>
            <li><a href="mypage.php">マイページ</a></li>
            <li><a href="regist.php">新規登録</a></li>
            <li><a href="http://tomorrow-workstyle.com/">ブログ</a></li>
   ...

CSS

.navigation{
  display: flex;
}
.navigation h1{
  flex: 1;
}
.navigation .logincontainer{
  max-width: 6em;
}

header h2 {
    font-size: 16px;
}
.collapse a{
  font-size: 1.1em;
  color: inherit;
}

@media screen and (min-width:801px) { /*PC用*/

.navbar .nav {
    margin: 0;
    display: table;
    width: 100%;
}

.navbar .nav li {
    display: table-cell;
    float: none;
}

.header_login {
    float: rightt;
    display: inline-block;
    font-size: 18px;
}
}/*@media screen閉じ*/

.navbar-header{
  padding-top: -20px;
}

footer {
    text-align: center;
    background-color: #dcdcdc
}

#l-common-footerNav {
  display: inline;
}