diff --git a/class.png b/class.png
index 08eb192..d9c159a 100644
--- a/class.png
+++ b/class.png
Binary files differ
diff --git a/class.pu b/class.pu
index 5a78ca7..b239eb7 100644
--- a/class.pu
+++ b/class.pu
@@ -11,6 +11,18 @@
 }
 note bottom of db : spring.datasource.url=jdbc:h2:mem:taskdb\nspring.jpa.hibernate.ddl-auto=none
 
+class SecurityConfig <<Configuration>> {
+	+ passwordEncoder() : PasswordEncoder
+	+ configure(WebSecurity)
+	configure(HttpSecurity)
+	configure(AuthenticationManagerBuilder)
+}
+
+class SecurityController <<Controller>> {
+  + success()
+  + showList(loginUser, model)
+}
+
 class City <<Entity>> {
   + id : Long
   - citycode : String
diff --git a/controller.png b/controller.png
index 91f5648..65f849e 100644
--- a/controller.png
+++ b/controller.png
Binary files differ
diff --git a/controller.pu b/controller.pu
index b81bd25..e214122 100644
--- a/controller.pu
+++ b/controller.pu
@@ -1,22 +1,30 @@
 @startuml
 
-[*] --> success : /login
-[*] --> index : /
+[*] --> sidebar
 
-state success {
-	state "Sign in" as login
-	login : Username
-	login : Password
+state sidebar {
+	state "ユーザ管理" as users
+	state "ログイン" as login
+	state "ログアウト" as logout
+	state "BLDGデータリスト" as indeies
+	state "BLDGデータ登録" as add
 }
-login --> index : / [success]
-login --> login : [!success]
 
-state index {
-	state cities
+state "Sign in" as signin {
+	signin : Username
+	signin : Password
+}
+login --> signin : /login
+signin --> signin : [!success]
+sidebar <-- signin : [success]
+
+state cities
 	cities : *{citycode}
 	cities : *{cityname}
 	cities : *{path}
 }
+indeies --> cities : /city
+
 state form {
 	state city {
 		city : citycode
@@ -25,10 +33,16 @@
 	}
 }
 
-index --> index : /delete/{citycode}
-index --> form : /edit/{citycode}
-index --> form : /add
-form --> index : /process[!hasErrors]
-form --> form : /process[hasErrors]
+state user {
+	user : username
+	user : role
+}
+users --> user : /user
+
+cities --> cities : /city/delete/{citycode}
+cities --> form : /city/edit/{citycode}
+add --> form : /city/add
+form --> sidebar : [!hasErrors]
+form --> form : [hasErrors]
 
 @enduml
\ No newline at end of file
diff --git a/pom.xml b/pom.xml
index 958d5e5..761aa3b 100644
--- a/pom.xml
+++ b/pom.xml
@@ -5,7 +5,7 @@
 	<parent>
 		<groupId>org.springframework.boot</groupId>
 		<artifactId>spring-boot-starter-parent</artifactId>
-		<version>2.7.1</version>
+		<version>2.6.2</version>
 		<relativePath/> <!-- lookup parent from repository -->
 	</parent>
 	<groupId>osm.surveyor.solr</groupId>
diff --git a/src/main/java/osm/surveyor/task/CityController.java b/src/main/java/osm/surveyor/task/CityController.java
deleted file mode 100644
index a4baace..0000000
--- a/src/main/java/osm/surveyor/task/CityController.java
+++ /dev/null
@@ -1,51 +0,0 @@
-package osm.surveyor.task;
-
-import org.springframework.stereotype.Controller;
-import org.springframework.ui.Model;
-import org.springframework.validation.BindingResult;
-import org.springframework.validation.annotation.Validated;
-import org.springframework.web.bind.annotation.GetMapping;
-import org.springframework.web.bind.annotation.ModelAttribute;
-import org.springframework.web.bind.annotation.PathVariable;
-import org.springframework.web.bind.annotation.PostMapping;
-
-import lombok.RequiredArgsConstructor;
-import osm.surveyor.task.model.City;
-
-@RequiredArgsConstructor
-@Controller
-public class CityController {
-	private final CityRepository repository;
-	
-	@GetMapping("/")
-	public String showList(Model model) {
-		model.addAttribute("cities", repository.findAll());
-		return "index";
-	}
-	
-	@GetMapping("/add")
-	public String addCity(@ModelAttribute City city) {
-		return "form";
-	}
-	
-	@PostMapping("/process")
-	public String process(@Validated @ModelAttribute City city, BindingResult result) {
-		if (result.hasErrors()) {
-			return "form";
-		}
-		repository.save(city);
-		return "redirect:/";
-	}
-
-	@GetMapping("/edit/{id}")
-	public String editCity(@PathVariable Long id, Model model) {
-		model.addAttribute("city", repository.findById(id));
-		return "form";
-	}
-
-	@GetMapping("/delete/{id}")
-	public String deleteCity(@PathVariable Long id) {
-		repository.deleteById(id);
-		return "redirect:/";
-	}
-}
diff --git a/src/main/java/osm/surveyor/task/CityRepository.java b/src/main/java/osm/surveyor/task/CityRepository.java
deleted file mode 100644
index 3145435..0000000
--- a/src/main/java/osm/surveyor/task/CityRepository.java
+++ /dev/null
@@ -1,8 +0,0 @@
-package osm.surveyor.task;
-
-import org.springframework.data.jpa.repository.JpaRepository;
-
-import osm.surveyor.task.model.City;
-
-public interface CityRepository extends JpaRepository<City,Long> {
-}
diff --git a/src/main/java/osm/surveyor/task/DataLoader.java b/src/main/java/osm/surveyor/task/DataLoader.java
deleted file mode 100644
index 2622a03..0000000
--- a/src/main/java/osm/surveyor/task/DataLoader.java
+++ /dev/null
@@ -1,29 +0,0 @@
-package osm.surveyor.task;
-
-import org.springframework.boot.CommandLineRunner;
-import org.springframework.stereotype.Component;
-
-import lombok.RequiredArgsConstructor;
-import osm.surveyor.task.model.City;
-
-@RequiredArgsConstructor
-@Component
-public class DataLoader implements CommandLineRunner {
-	private final CityRepository repository;
-	
-	@Override
-	public void run(String... args) throws Exception {
-		City city = new City();
-		city.setCitycode("01100");
-		city.setCityname("北海道 札幌市");
-		city.setFolder("01100_sapporo-shi_2020");
-		repository.save(city);
-
-		city = new City();
-		city.setCitycode("07203");
-		city.setCityname("福島県 郡山市");
-		city.setFolder("07203_koriyama-shi_2020");
-		repository.save(city);
-	}
-
-}
diff --git a/src/main/java/osm/surveyor/task/city/CityController.java b/src/main/java/osm/surveyor/task/city/CityController.java
new file mode 100644
index 0000000..3e411fd
--- /dev/null
+++ b/src/main/java/osm/surveyor/task/city/CityController.java
@@ -0,0 +1,51 @@
+package osm.surveyor.task.city;
+
+import org.springframework.stereotype.Controller;
+import org.springframework.ui.Model;
+import org.springframework.validation.BindingResult;
+import org.springframework.validation.annotation.Validated;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.ModelAttribute;
+import org.springframework.web.bind.annotation.PathVariable;
+import org.springframework.web.bind.annotation.PostMapping;
+
+import lombok.RequiredArgsConstructor;
+import osm.surveyor.task.city.model.City;
+
+@RequiredArgsConstructor
+@Controller
+public class CityController {
+	private final CityRepository repository;
+	
+	@GetMapping("/city")
+	public String showList(Model model) {
+		model.addAttribute("cities", repository.findAll());
+		return "cities";
+	}
+	
+	@GetMapping("/city/add")
+	public String addCity(@ModelAttribute City city) {
+		return "form";
+	}
+	
+	@PostMapping("/city/process")
+	public String process(@Validated @ModelAttribute City city, BindingResult result) {
+		if (result.hasErrors()) {
+			return "form";
+		}
+		repository.save(city);
+		return "redirect:/city";
+	}
+
+	@GetMapping("/city/edit/{id}")
+	public String editCity(@PathVariable Long id, Model model) {
+		model.addAttribute("city", repository.findById(id));
+		return "form";
+	}
+
+	@GetMapping("/city/delete/{id}")
+	public String deleteCity(@PathVariable Long id) {
+		repository.deleteById(id);
+		return "redirect:/city";
+	}
+}
diff --git a/src/main/java/osm/surveyor/task/city/CityRepository.java b/src/main/java/osm/surveyor/task/city/CityRepository.java
new file mode 100644
index 0000000..a53971f
--- /dev/null
+++ b/src/main/java/osm/surveyor/task/city/CityRepository.java
@@ -0,0 +1,8 @@
+package osm.surveyor.task.city;
+
+import org.springframework.data.jpa.repository.JpaRepository;
+
+import osm.surveyor.task.city.model.City;
+
+public interface CityRepository extends JpaRepository<City,Long> {
+}
diff --git a/src/main/java/osm/surveyor/task/city/DataLoader.java b/src/main/java/osm/surveyor/task/city/DataLoader.java
new file mode 100644
index 0000000..2f86601
--- /dev/null
+++ b/src/main/java/osm/surveyor/task/city/DataLoader.java
@@ -0,0 +1,29 @@
+package osm.surveyor.task.city;
+
+import org.springframework.boot.CommandLineRunner;
+import org.springframework.stereotype.Component;
+
+import lombok.RequiredArgsConstructor;
+import osm.surveyor.task.city.model.City;
+
+@RequiredArgsConstructor
+@Component
+public class DataLoader implements CommandLineRunner {
+	private final CityRepository repository;
+	
+	@Override
+	public void run(String... args) throws Exception {
+		City city = new City();
+		city.setCitycode("01100");
+		city.setCityname("北海道 札幌市");
+		city.setFolder("01100_sapporo-shi_2020");
+		repository.save(city);
+
+		city = new City();
+		city.setCitycode("07203");
+		city.setCityname("福島県 郡山市");
+		city.setFolder("07203_koriyama-shi_2020");
+		repository.save(city);
+	}
+
+}
diff --git a/src/main/java/osm/surveyor/task/city/model/City.java b/src/main/java/osm/surveyor/task/city/model/City.java
new file mode 100644
index 0000000..0e4e7be
--- /dev/null
+++ b/src/main/java/osm/surveyor/task/city/model/City.java
@@ -0,0 +1,32 @@
+package osm.surveyor.task.city.model;
+
+import javax.persistence.Entity;
+import javax.persistence.GeneratedValue;
+import javax.persistence.GenerationType;
+import javax.persistence.Id;
+import javax.validation.constraints.NotBlank;
+
+import lombok.Getter;
+import lombok.Setter;
+
+@Getter
+@Setter
+@Entity
+public class City {
+	@Id
+	@GeneratedValue(strategy=GenerationType.IDENTITY)
+	private Long id;
+	
+	@NotBlank
+	private String citycode;
+	
+	@NotBlank
+	private String cityname;
+	
+	@NotBlank
+	private String folder;
+	
+	private Double lng;
+	
+	private Double lat;
+}
diff --git a/src/main/java/osm/surveyor/task/config/SecurityConfig.java b/src/main/java/osm/surveyor/task/config/SecurityConfig.java
deleted file mode 100644
index e03eb35..0000000
--- a/src/main/java/osm/surveyor/task/config/SecurityConfig.java
+++ /dev/null
@@ -1,47 +0,0 @@
-package osm.surveyor.task.config;
-
-import org.springframework.context.annotation.Bean;
-import org.springframework.context.annotation.Configuration;
-import org.springframework.security.config.annotation.authentication.builders.AuthenticationManagerBuilder;
-import org.springframework.security.config.annotation.web.builders.HttpSecurity;
-import org.springframework.security.config.annotation.web.configuration.EnableWebSecurity;
-import org.springframework.security.config.annotation.web.configuration.WebSecurityConfigurerAdapter;
-import org.springframework.security.crypto.bcrypt.BCryptPasswordEncoder;
-import org.springframework.security.crypto.password.PasswordEncoder;
-
-@Configuration
-@EnableWebSecurity
-public class SecurityConfig extends WebSecurityConfigurerAdapter {
-
-    @Bean
-    public PasswordEncoder passwordEncoder() {
-        // パスワードの暗号化用に、BCrypt（ビー・クリプト）を使用します
-        return new BCryptPasswordEncoder();
-    }
-
-    @Override
-    protected void configure(HttpSecurity http) throws Exception {
-        http
-            // 認証リクエストの設定
-            .authorizeRequests()
-                // 認証の必要があるように設定
-                .anyRequest().authenticated()
-                .and()
-            // フォームベース認証の設定
-            .formLogin();
-    }
-
-    @Override
-    protected void configure(AuthenticationManagerBuilder auth)
-            throws Exception {
-        auth
-            // メモリ内認証を設定
-            .inMemoryAuthentication()
-            // "user"を追加
-            .withUser("user")
-            // "password"をBCryptで暗号化
-            .password(passwordEncoder().encode("password"))
-             // 権限（ロール）を設定
-            .authorities("ROLE_USER");
-    }
-}
diff --git a/src/main/java/osm/surveyor/task/controller/SecurityController.java b/src/main/java/osm/surveyor/task/controller/SecurityController.java
deleted file mode 100644
index 0b61f97..0000000
--- a/src/main/java/osm/surveyor/task/controller/SecurityController.java
+++ /dev/null
@@ -1,13 +0,0 @@
-package osm.surveyor.task.controller;
-
-import org.springframework.stereotype.Controller;
-import org.springframework.web.bind.annotation.GetMapping;
-
-@Controller
-public class SecurityController {
-
-    @GetMapping("/login")
-    public String success() {
-        return "success";
-    }
-}
diff --git a/src/main/java/osm/surveyor/task/model/City.java b/src/main/java/osm/surveyor/task/model/City.java
deleted file mode 100644
index 68138ec..0000000
--- a/src/main/java/osm/surveyor/task/model/City.java
+++ /dev/null
@@ -1,32 +0,0 @@
-package osm.surveyor.task.model;
-
-import javax.persistence.Entity;
-import javax.persistence.GeneratedValue;
-import javax.persistence.GenerationType;
-import javax.persistence.Id;
-import javax.validation.constraints.NotBlank;
-
-import lombok.Getter;
-import lombok.Setter;
-
-@Getter
-@Setter
-@Entity
-public class City {
-	@Id
-	@GeneratedValue(strategy=GenerationType.IDENTITY)
-	private Long id;
-	
-	@NotBlank
-	private String citycode;
-	
-	@NotBlank
-	private String cityname;
-	
-	@NotBlank
-	private String folder;
-	
-	private Double lng;
-	
-	private Double lat;
-}
diff --git a/src/main/java/osm/surveyor/task/user/config/SecurityConfig.java b/src/main/java/osm/surveyor/task/user/config/SecurityConfig.java
new file mode 100644
index 0000000..0b9e181
--- /dev/null
+++ b/src/main/java/osm/surveyor/task/user/config/SecurityConfig.java
@@ -0,0 +1,69 @@
+package osm.surveyor.task.user.config;
+
+import org.springframework.context.annotation.Bean;
+import org.springframework.context.annotation.Configuration;
+import org.springframework.security.config.annotation.authentication.builders.AuthenticationManagerBuilder;
+import org.springframework.security.config.annotation.web.builders.HttpSecurity;
+import org.springframework.security.config.annotation.web.builders.WebSecurity;
+import org.springframework.security.config.annotation.web.configuration.EnableWebSecurity;
+import org.springframework.security.config.annotation.web.configuration.WebSecurityConfigurerAdapter;
+import org.springframework.security.crypto.bcrypt.BCryptPasswordEncoder;
+import org.springframework.security.crypto.password.PasswordEncoder;
+import org.springframework.security.web.util.matcher.AntPathRequestMatcher;
+
+@Configuration
+@EnableWebSecurity
+public class SecurityConfig extends WebSecurityConfigurerAdapter {
+
+    @Bean
+    public PasswordEncoder passwordEncoder() {
+        return new BCryptPasswordEncoder();
+    }
+
+    @Override
+    public void configure(WebSecurity web) throws Exception {
+        // セキュリティ設定を、無視（ignoring）するパスを指定します
+        // 通常、cssやjs、imgなどの静的リソースを指定します
+        web.ignoring().antMatchers("/city/**", "/css/**", "/img/**", "/webjars/**");
+    }
+
+    @Override
+    protected void configure(HttpSecurity http) throws Exception {
+        http.authorizeRequests()
+		        // 「/login」と「/error」をアクセス可能にします
+		        .antMatchers("/login", "/error").permitAll()
+		        .anyRequest().authenticated()
+		        .and()
+		    .formLogin()
+		        // ログイン時のURLを指定
+		        .loginPage("/login")
+		        // 認証後にリダイレクトする場所を指定
+		        .defaultSuccessUrl("/")
+		        .and()
+		    // ログアウトの設定
+		    .logout()
+		        // ログアウト時のURLを指定
+		        .logoutRequestMatcher(new AntPathRequestMatcher("/logout"))
+		        .and()
+		    // Remember-Meの認証を許可します
+		    // これを設定すると、ブラウザを閉じて、
+		    // 再度開いた場合でも「ログインしたまま」にできます
+		    .rememberMe();
+    }
+
+    /**
+     * ユーザ名「admin」と「user」を用意します
+     * パスワードは両方とも「password」です
+     */
+    @Override
+    protected void configure(AuthenticationManagerBuilder auth) throws Exception {
+        auth.inMemoryAuthentication()
+	        .withUser("admin")
+	            .password(passwordEncoder().encode("password"))
+	            .authorities("ROLE_ADMIN")
+	            .and()
+	        .withUser("user")
+	            .password(passwordEncoder().encode("password"))
+	            .authorities("ROLE_USER");
+    }
+}
diff --git a/src/main/java/osm/surveyor/task/user/controller/SecurityController.java b/src/main/java/osm/surveyor/task/user/controller/SecurityController.java
new file mode 100644
index 0000000..adfa9de
--- /dev/null
+++ b/src/main/java/osm/surveyor/task/user/controller/SecurityController.java
@@ -0,0 +1,28 @@
+package osm.surveyor.task.user.controller;
+
+import org.springframework.security.core.Authentication;
+import org.springframework.stereotype.Controller;
+import org.springframework.ui.Model;
+import org.springframework.web.bind.annotation.GetMapping;
+
+@Controller
+public class SecurityController {
+
+    @GetMapping("/login")
+    public String success() {
+        return "login";
+    }
+
+    @GetMapping("/")
+    public String showList(Authentication loginUser, Model model) {
+    	if (loginUser == null) {
+            model.addAttribute("username", "");
+            model.addAttribute("role", "");
+    	}
+    	else {
+            model.addAttribute("username", loginUser.getName());
+            model.addAttribute("role", loginUser.getAuthorities());
+    	}
+        return "user";
+    }
+}
diff --git a/src/main/resources/templates/cities.html b/src/main/resources/templates/cities.html
new file mode 100644
index 0000000..8df72f2
--- /dev/null
+++ b/src/main/resources/templates/cities.html
@@ -0,0 +1,80 @@
+<!DOCTYPE html>
+<html xmlns:th="http://www.thymeleaf.org"
+  xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+  layout:decorate="~{layout/layout}">
+<head>
+  <meta charset="UTF-8" th:remove="tag">
+</head>
+<body>
+
+  <!-- サイドバーの表示 -->
+  <div layout:fragment="sidebar"
+    th:replace="~{fragments/sidebar :: sidebar}">
+  </div>
+
+
+  <!-- コンテンツの表示 -->
+  <div layout:fragment="content">
+    <main class="offcanvas-outside bg-light">
+      <div class="container-fluid">
+
+        <!-- トグルボタン -->
+        <div th:replace="~{fragments/sidebar :: toggler}">
+        </div>
+
+        <div class="row">
+          <div class="col">
+
+            <div class="card shadow">
+              <div class="card-header">
+                <h6 class="text-navy my-2">Plateau 3D都市データ リスト</h6>
+              </div>
+              <div class="card-body">
+
+                <!-- 
+                <div th:if="${mappers.size() == 0}">
+                  該当データがありません
+                </div>
+                 -->
+
+                <table class="table table-bordered">
+                  <thead>
+                    <tr>
+                      <th>#</th>
+                      <th>citycode</th>
+                      <th>cityname</th>
+                      <th>folder</th>
+                      <th></th>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    <tr th:each="city : ${cities}" th:object="${city}">
+                      <td th:text="*{id}"></td>
+                      <td th:text="*{citycode}"></td>
+                      <td th:text="*{cityname}"></td>
+                      <td th:text="*{folder}"></td>
+                      <td>
+                        <a th:href="@{/city/edit/{id}(id=*{id})}" class="btn btn-navy">
+                          <i class="bi bi-pencil-square"></i>
+                          編集
+                        </a>
+
+                        <a th:href="@{/city/delete/{id}(id=*{id})}" class="btn btn-danger">
+                          <i class="bi bi-trash-fill"></i>
+                          削除
+                        </a>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </div>
+            </div>
+
+          </div>
+        </div>
+      </div>
+    </main>
+  </div>
+
+</body>
+</html>
diff --git a/src/main/resources/templates/error.html b/src/main/resources/templates/error.html
index ee0a35d..25d6e0f 100644
--- a/src/main/resources/templates/error.html
+++ b/src/main/resources/templates/error.html
@@ -7,6 +7,11 @@
 </head>
 <body>
 
+  <!-- サイドバーの表示 -->
+  <div layout:fragment="sidebar"
+    th:replace="~{fragments/sidebar :: sidebar}">
+  </div>
+
   <!-- コンテンツの表示 -->
   <div layout:fragment="content">
     <main class="offcanvas-outside bg-light vh-100">
diff --git a/src/main/resources/templates/form.html b/src/main/resources/templates/form.html
index 7333438..756e682 100644
--- a/src/main/resources/templates/form.html
+++ b/src/main/resources/templates/form.html
@@ -7,6 +7,12 @@
 </head>
 <body>
 
+  <!-- サイドバーの表示 -->
+  <div layout:fragment="sidebar"
+    th:replace="~{fragments/sidebar :: sidebar}">
+  </div>
+
+
   <!-- コンテンツの表示 -->
   <div layout:fragment="content">
     <main class="offcanvas-outside bg-light">
@@ -24,7 +30,7 @@
                 <h6 class="text-navy my-2">マッパー登録</h6>
               </div>
               <div class="card-body">
-                <form th:action="@{/process}" th:object="${city}" method="post">
+                <form th:action="@{/city/process}" th:object="${city}" method="post">
                   <input type="hidden" th:field="*{id}">
 
                   <div class="mb-3">
diff --git a/src/main/resources/templates/fragments/message.html b/src/main/resources/templates/fragments/message.html
new file mode 100644
index 0000000..b0043fa
--- /dev/null
+++ b/src/main/resources/templates/fragments/message.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html xmlns:th="http://www.thymeleaf.org">
+<head>
+  <meta charset="UTF-8">
+</head>
+<body>
+
+  <!-- ログインメッセージ -->
+  <div th:fragment="login">
+    <div class="alert alert-danger" th:if="${param.error}">
+      <small>ユーザ名またはパスワードが正しくありません</small>
+    </div>
+    <div class="alert alert-success" th:if="${param.register}">
+      <small>ユーザを新規登録しました</small>
+    </div>
+    <div class="alert alert-success" th:if="${param.logout}">
+      <small>ログアウトしました</small>
+    </div>
+  </div>
+
+  <!-- エラーメッセージ(404 Not Foundなど) -->
+  <div th:fragment="error">
+    <div class="text-center">
+      <div class="display-1" th:text="${status}"></div>
+      <div class="text-muted mb-4" th:text="${error}"></div>
+
+      <div class="text-muted">ページを表示できません</div>
+      <a th:href="@{/}">&larr; ホームに戻る</a>
+    </div>
+  </div>
+
+</body>
+</html>
diff --git a/src/main/resources/templates/fragments/sidebar.html b/src/main/resources/templates/fragments/sidebar.html
index 46ae356..6200151 100644
--- a/src/main/resources/templates/fragments/sidebar.html
+++ b/src/main/resources/templates/fragments/sidebar.html
@@ -1,11 +1,81 @@
 <!DOCTYPE html>
 <html xmlns:th="http://www.thymeleaf.org">
 <head>
-  <!-- レイアウトで使わないので、th:remove="tag"は不要です -->
   <meta charset="UTF-8">
 </head>
 <body>
 
+  <!-- サイドバー -->
+  <div th:fragment="sidebar">
+    <div class="offcanvas offcanvas-start"
+      data-bs-scroll="true"
+      data-bs-backdrop="false"
+      tabindex="-1"
+      id="offcanvasScrolling"
+      aria-labelledby="offcanvasScrollingLabel">
+      <nav class="navbar-dark bg-image text-white h-100">
+
+        <div class="offcanvas-header">
+          <h4 class="offcanvas-title">
+            <a th:href="@{/city}" class="text-white">
+              <span class="d-inline-block me-1"
+                style="transform: rotate(-15deg)">
+                <i class="bi bi-credit-card-2-front-fill fs-3">
+                </i>
+              </span>
+              Plateau-BLDG
+            </a>
+          </h4>
+        </div>
+  
+        <div class="offcanvas-body pt-0">
+          <hr class="mt-1">
+          <ul class="navbar-nav">
+            <li class="nav-item">
+              <a th:href="@{/}" class="nav-link text-white">
+                <i class="bi bi-person-fill me-2"></i>
+                ユーザ管理
+              </a>
+            </li>
+            <li class="nav-item">
+              <a th:href="@{/login}" class="nav-link text-white">
+                <i class="bi bi-person-fill me-2"></i>
+                ログイン
+              </a>
+            </li>
+            <li class="nav-item">
+              <a th:href="@{/logout}" class="nav-link text-white">
+                <i class="bi bi-box-arrow-right me-2"></i>
+                ログアウト
+              </a>
+            </li>
+            <li class="nav-item">
+              <a th:href="@{/city}" class="nav-link text-white">
+                <i class="bi bi-table me-2"></i>
+                BLDGデータリスト
+              </a>
+            </li>
+            <li class="nav-item">
+              <a th:href="@{/city/add}" class="nav-link text-white">
+                <i class="bi bi-person-fill me-2"></i>
+                BLDGデータ登録
+              </a>
+            </li>
+          </ul>
+
+          <hr>
+          <!-- 閉じるボタン(画面が小さい時に表示) -->
+          <div class="text-center d-lg-none">
+            <button type="button" class="btn-circle btn-light"
+              data-bs-dismiss="offcanvas" aria-label="Close">
+              <i class="bi bi-chevron-left"></i>
+            </button>
+          </div>
+        </div>
+      </nav>
+    </div>
+  </div>
+
   <!-- サイドバー折りたたみ時のトグルボタン -->
   <div th:fragment="toggler">
     <nav class="navbar navbar-expand-lg navbar-light">
diff --git a/src/main/resources/templates/index.html b/src/main/resources/templates/index.html
deleted file mode 100644
index 87ce816..0000000
--- a/src/main/resources/templates/index.html
+++ /dev/null
@@ -1,74 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org"
-  xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
-  layout:decorate="~{layout/layout}">
-<head>
-  <meta charset="UTF-8" th:remove="tag">
-</head>
-<body>
-
-  <!-- コンテンツの表示 -->
-  <div layout:fragment="content">
-    <main class="offcanvas-outside bg-light">
-      <div class="container-fluid">
-
-        <!-- トグルボタン -->
-        <div th:replace="~{fragments/sidebar :: toggler}">
-        </div>
-
-        <div class="row">
-          <div class="col">
-
-            <div class="card shadow">
-              <div class="card-header">
-                <h6 class="text-navy my-2">Plateau 3D都市データ リスト</h6>
-              </div>
-              <div class="card-body">
-
-                <!-- 
-                <div th:if="${mappers.size() == 0}">
-                  該当データがありません
-                </div>
-                 -->
-
-                <table class="table table-bordered">
-                  <thead>
-                    <tr>
-                      <th>#</th>
-                      <th>citycode</th>
-                      <th>cityname</th>
-                      <th>folder</th>
-                      <th></th>
-                    </tr>
-                  </thead>
-                  <tbody>
-                    <tr th:each="city : ${cities}" th:object="${city}">
-                      <td th:text="*{id}"></td>
-                      <td th:text="*{citycode}"></td>
-                      <td th:text="*{cityname}"></td>
-                      <td th:text="*{folder}"></td>
-                      <td>
-                        <a th:href="@{/edit/{id}(id=*{id})}" class="btn btn-navy">
-                          <i class="bi bi-pencil-square"></i>
-                          編集
-                        </a>
-
-                        <a th:href="@{/delete/{id}(id=*{id})}" class="btn btn-danger">
-                          <i class="bi bi-trash-fill"></i>
-                          削除
-                        </a>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </div>
-            </div>
-
-          </div>
-        </div>
-      </div>
-    </main>
-  </div>
-
-</body>
-</html>
diff --git a/src/main/resources/templates/layout/layout.html b/src/main/resources/templates/layout/layout.html
index ae189b9..295305c 100644
--- a/src/main/resources/templates/layout/layout.html
+++ b/src/main/resources/templates/layout/layout.html
@@ -13,54 +13,8 @@
 </head>
 <body>
 
-  <div class="offcanvas offcanvas-start"
-    data-bs-scroll="true"
-    data-bs-backdrop="false"
-    tabindex="-1"
-    id="offcanvasScrolling"
-    aria-labelledby="offcanvasScrollingLabel">
-    <nav class="navbar-dark bg-image text-white h-100">
-
-      <div class="offcanvas-header">
-        <h4 class="offcanvas-title">
-          <a th:href="@{/}" class="text-white">
-            <span class="d-inline-block me-1"
-              style="transform: rotate(-15deg)">
-              <i class="bi bi-credit-card-2-front-fill fs-3">
-              </i>
-            </span>
-            Plateau-BLDG
-          </a>
-        </h4>
-      </div>
-
-      <div class="offcanvas-body pt-0">
-        <hr class="mt-1">
-        <ul class="navbar-nav">
-          <li class="nav-item">
-            <a th:href="@{/}" class="nav-link text-white">
-              <i class="bi bi-table me-2"></i>
-              BLDGデータリスト
-            </a>
-          </li>
-          <li class="nav-item">
-            <a th:href="@{/add}" class="nav-link text-white">
-              <i class="bi bi-person-fill me-2"></i>
-              BLDGデータ登録
-            </a>
-          </li>
-        </ul>
-
-        <hr>
-        <!-- 閉じるボタン(画面が小さい時に表示) -->
-        <div class="text-center d-lg-none">
-          <button type="button" class="btn-circle btn-light"
-            data-bs-dismiss="offcanvas" aria-label="Close">
-            <i class="bi bi-chevron-left"></i>
-          </button>
-        </div>
-      </div>
-    </nav>
+  <!-- サイドバーの配置 -->
+  <div layout:fragment="sidebar">
   </div>
 
   <!-- コンテンツの配置 -->
diff --git a/src/main/resources/templates/login.html b/src/main/resources/templates/login.html
new file mode 100644
index 0000000..b5dcff7
--- /dev/null
+++ b/src/main/resources/templates/login.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html xmlns:th="http://www.thymeleaf.org"
+  xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+  layout:decorate="~{layout/layout}">
+<head>
+  <meta charset="UTF-8" th:remove="tag">
+</head>
+<body>
+
+  <!-- サイドバーの表示 -->
+  <div layout:fragment="sidebar"
+    th:replace="~{fragments/sidebar :: sidebar}">
+  </div>
+
+  <!-- コンテンツの表示 -->
+  <main layout:fragment="content" class="bg-image">
+    <div class="container">
+      <!-- 画面中央に配置 -->
+      <div class="row vh-100 align-items-center justify-content-center">
+
+        <div class="card shadow" style="max-width: 480px;">
+          <div class="card-body">
+            <h3 class="card-title mb-3 text-center text-navy">ログイン</h3>
+
+            <!-- ログインメッセージ -->
+            <div th:replace="~{fragments/message :: login}">
+            </div>
+
+            <form th:action="@{/login}" method="post">
+              <div class="mb-3">
+                <input class="form-control" type="text" name="username" placeholder="ユーザ名">
+              </div>
+
+              <div class="mb-3">
+                <input class="form-control" type="password" name="password" placeholder="パスワード">
+              </div>
+
+              <div class="mb-3 form-check">
+                <input class="form-check-input" type="checkbox" id="remember-me" name="remember-me">
+                <label class="form-check-label" for="remember-me">
+                  ログインしたままにする
+                </label>
+              </div>
+
+              <button class="w-100 btn btn-navy" type="submit">ログイン</button>
+            </form>
+
+            <hr>
+            <!-- こちらは、次（DBのユーザでログインする）で使います
+            <div class="text-center">
+              <a th:href="@{/register}" class="text-navy">
+                新規登録はこちら
+              </a>
+            </div>
+            -->
+          </div>
+        </div>
+
+      </div>
+    </div>
+  </main>
+
+</body>
+</html>
diff --git a/src/main/resources/templates/success.html b/src/main/resources/templates/success.html
deleted file mode 100644
index 2a24ba1..0000000
--- a/src/main/resources/templates/success.html
+++ /dev/null
@@ -1,16 +0,0 @@
-<!DOCTYPE html>
-<html xmlns:th="http://www.thymeleaf.org">
-<head>
-  <meta charset="UTF-8">
-  <title>Title</title>
-</head>
-<body>
-  <h2>ログイン成功</h2>
-  <a th:href="@{/logout}">ログアウトの確認メッセージへ</a><br>
-  <br>
-
-  <form th:action="@{/logout}" method="post">
-    <button>ログアウトする</button>
-  </form>
-</body>
-</html>
diff --git a/src/main/resources/templates/user.html b/src/main/resources/templates/user.html
new file mode 100644
index 0000000..4eb9f96
--- /dev/null
+++ b/src/main/resources/templates/user.html
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html xmlns:th="http://www.thymeleaf.org"
+  xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+  layout:decorate="~{layout/layout}">
+<head>
+  <meta charset="UTF-8" th:remove="tag">
+</head>
+<body>
+
+  <!-- サイドバーの表示 -->
+  <div layout:fragment="sidebar"
+    th:replace="~{fragments/sidebar :: sidebar}">
+  </div>
+
+  <!-- コンテンツの表示 -->
+  <main layout:fragment="content"
+    class="offcanvas-outside bg-light">
+    <div class="container-fluid">
+      <!-- トグルボタン -->
+      <div th:replace="~{fragments/sidebar :: toggler}">
+      </div>
+
+      <div class="row">
+        <div class="col">
+
+          <div class="card shadow">
+            <div class="card-header">
+              <h6 class="text-navy my-2">
+                ログイン情報
+              </h6>
+            </div>
+            <div class="card-body table-responsive">
+              <table class="table table-bordered">
+                <thead>
+                  <tr>
+                    <th>ログインユーザ名</th>
+                    <th>ユーザ権限</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <td th:text="${username}"></td>
+                    <td th:text="${role}"></td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+          </div>
+
+        </div>
+      </div>
+    </div>
+  </main>
+
+</body>
+</html>