diff --git a/frontend/images/apple-2385198_1280-1.jpg b/frontend/images/apple-2385198_1280-1.jpg
new file mode 100644
index 000000000..d83433eb0
Binary files /dev/null and b/frontend/images/apple-2385198_1280-1.jpg differ
diff --git a/frontend/images/sidebar-radio-img.png b/frontend/images/sidebar-radio-img.png
new file mode 100644
index 000000000..f86086155
Binary files /dev/null and b/frontend/images/sidebar-radio-img.png differ
diff --git a/frontend/package.json b/frontend/package.json
index e508134bb..e4c09a9c9 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -19,7 +19,7 @@
     "css-loader": "^0.28.11",
     "source-map-loader": "^0.2.3",
     "style-loader": "^0.21.0",
-    "typescript": "^2.9.1",
+    "typescript": "^3.4.5",
     "webpack": "^4.10.2",
     "webpack-cli": "^2.1.4"
   },
@@ -27,7 +27,8 @@
     "@types/react": "^16.3.16",
     "@types/react-dom": "^16.0.5",
     "@types/react-router-dom": "^4.2.7",
-    "@types/react-slick": "^0.23.1",
+    "@types/react-slick": "^0.23.4",
+    "@types/styled-components": "^4.1.6",
     "axios": "^0.18.0",
     "babel-polyfill": "^6.26.0",
     "clean-webpack-plugin": "^1.0.0",
@@ -39,10 +40,10 @@
     "react": "^16.4.0",
     "react-dom": "^16.4.0",
     "react-router-dom": "^4.3.1",
-    "react-slick": "^0.23.1",
+    "react-slick": "^0.24.0",
     "react-twitter-widgets": "^1.7.1",
     "slick-carousel": "^1.8.1",
-    "styled-components": "^3.3.2",
+    "styled-components": "^4.1.3",
     "tslint": "^5.11.0",
     "tslint-config-prettier": "^1.17.0",
     "tslint-plugin-prettier": "^2.0.1",
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index e6307fc96..6e9e40115 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -5,9 +5,9 @@ import { Main } from "./layouts/Main";
 import { Footer } from "./layouts/Footer";
 
 export const App = () => (
-  <div>
+  <React.Fragment>
     <Header />
     <Main />
     <Footer />
-  </div>
+  </React.Fragment>
 );
diff --git a/frontend/src/api/ContactApi.ts b/frontend/src/api/ContactApi.ts
index 0105fb520..8df0a7ef4 100644
--- a/frontend/src/api/ContactApi.ts
+++ b/frontend/src/api/ContactApi.ts
@@ -1,13 +1,13 @@
 import RestClient from "./RestClient";
 
 export default class ContactApi {
-  restClient: RestClient;
+  public restClient: RestClient;
 
   constructor(restClient: RestClient) {
     this.restClient = restClient;
   }
 
-  saveContact(json: object, succussed: (res: object) => void, errored: (err: object) => void, always = () => {}) {
+  public saveContact(json: object, succussed: (res: object) => void, errored: (err: object) => void, always = () => {}) {
     return this.restClient.post("/api/v1/contacts", json, succussed, errored, always);
   }
 }
diff --git a/frontend/src/api/RestClient.ts b/frontend/src/api/RestClient.ts
index bdd3bac48..7ec5f4c70 100644
--- a/frontend/src/api/RestClient.ts
+++ b/frontend/src/api/RestClient.ts
@@ -1,21 +1,21 @@
 export default class RestClient {
-  axios: any;
+  public axios: any;
 
   constructor(baseUrl: string) {
     const axiosBase = require("axios");
-    const csrfToken = (<HTMLMetaElement>document.querySelector("meta[name=csrf-token]")).content;
+    const csrfToken = (document.querySelector("meta[name=csrf-token]") as HTMLMetaElement).content;
 
     this.axios = axiosBase.create({
       baseURL: baseUrl,
       timeout: 1000,
       headers: {
         "Content-Type": "application/json",
-        "X-CSRF-TOKEN": csrfToken,
-      },
+        "X-CSRF-TOKEN": csrfToken
+      }
     });
   }
 
-  get(
+  public get(
     path: string,
     params: object,
     successed: (res: object) => void,
@@ -23,7 +23,7 @@ export default class RestClient {
     always = () => {}
   ) {
     return this.axios
-      .get(path, { params: params })
+      .get(path, { params })
       .then((result: object) => {
         console.log(`GET ${this.axios.baseURL}/${path}`);
         console.log(`result: ${JSON.stringify(result)}`);
@@ -37,7 +37,7 @@ export default class RestClient {
       .then(always());
   }
 
-  post(
+  public post(
     path: string,
     params: object,
     successed: (res: object) => void,
@@ -59,7 +59,7 @@ export default class RestClient {
       .then(always());
   }
 
-  delete(
+  public delete(
     path: string,
     params: object,
     successed: (res: object) => void,
diff --git a/frontend/src/commons/ChkButtonBase.tsx b/frontend/src/commons/ChkButtonBase.tsx
index 85e65db33..20c37f5f4 100644
--- a/frontend/src/commons/ChkButtonBase.tsx
+++ b/frontend/src/commons/ChkButtonBase.tsx
@@ -1,17 +1,72 @@
-import styled from "styled-components";
+import * as React from "react";
+import { Link } from "react-router-dom";
+import styled, { css } from "styled-components";
+
 import { chkColors } from "./color";
 
-export const ChkButtonBase = styled.div`
+interface IPropsCss {
+  color?: string;
+  bgcolor?: string;
+  border?: string;
+}
+
+interface IPropsChkButtonBase extends IPropsCss {
+  to?: string;
+  text: string | React.ReactNode;
+  name?: string;
+}
+
+const ChkButtonBase = (props: IPropsChkButtonBase) => {
+  const { to, text, name } = props;
+  const { color, bgcolor, border } = props;
+
+  if (to) {
+    if (to.startsWith("http")) {
+      return (
+        <ATag color={color} bgcolor={bgcolor} border={border} href={to}>
+          {text}
+        </ATag>
+      );
+    } else {
+      return (
+        <LinkTag color={color} bgcolor={bgcolor} border={border} to={to}>
+          {text}
+        </LinkTag>
+      );
+    }
+  } else {
+    return (
+      <ButtonTag name={name} color={color} bgcolor={bgcolor} border={border}>
+        {text}
+      </ButtonTag>
+    );
+  }
+};
+
+const ButtonStyle = css`
   display: block;
-  color: white;
+  width: 100%;
+  margin: 0;
+  padding: 10px;
   outline: none;
-  border-style: none;
   box-shadow: 4px 3px 10px 0px ${chkColors.shadow};
+  border-radius: 20px;
   text-align: center;
-  margin: 0;
-  padding: 10px;
-  width: 100%;
-  line-height: 1.5rem;
-  border-radius: 1.5rem;
-  background-color: ${chkColors.orange};
+  color: ${(props: IPropsCss) => (props.color ? chkColors[props.color] : chkColors.white)};
+  border: ${(props: IPropsCss) => (props.border ? `2px solid ${chkColors[props.border]}` : "none")};
+  background-color: ${(props: IPropsCss) => (props.bgcolor ? chkColors[props.bgcolor] : chkColors.orange)};
 `;
+
+const ButtonTag = styled.button`
+  ${ButtonStyle}
+`;
+
+const LinkTag = styled(Link)`
+  ${ButtonStyle}
+`;
+
+const ATag = styled.a`
+  ${ButtonStyle}
+`;
+
+export default ChkButtonBase;
diff --git a/frontend/src/commons/color.ts b/frontend/src/commons/color.ts
index 6ea0da8e8..7e3e19c6c 100644
--- a/frontend/src/commons/color.ts
+++ b/frontend/src/commons/color.ts
@@ -1,4 +1,8 @@
-export const chkColors = {
+interface IColor {
+  [key: string]: string;
+}
+
+export const chkColors: IColor = {
   orange: "#edb600",
   blue: "#66C9DB",
   skyblue: "#A8E1E3",
@@ -6,5 +10,7 @@ export const chkColors = {
   gray: "#7f8287",
   shadow: "#14141433",
   white: "#ffffff",
-  placeholder: "#b0bec5"
+  placeholder: "#b0bec5",
+  aqua: "#b3dfe2",
+  darkenAqua: "#50AAB7"
 };
diff --git a/frontend/src/commons/font.ts b/frontend/src/commons/font.ts
index 1f15ecca8..7e8876c98 100644
--- a/frontend/src/commons/font.ts
+++ b/frontend/src/commons/font.ts
@@ -1,4 +1,4 @@
-import { injectGlobal } from "styled-components";
+import { css } from "styled-components";
 import * as Quicksand300Woff from "./../../fonts/quicksand-v7-latin/quicksand-v7-latin-300.woff";
 import * as Quicksand300Woff2 from "./../../fonts/quicksand-v7-latin/quicksand-v7-latin-300.woff2";
 import * as Quicksand500Woff from "./../../fonts/quicksand-v7-latin/quicksand-v7-latin-500.woff";
@@ -8,42 +8,38 @@ import * as Quicksand700Woff2 from "./../../fonts/quicksand-v7-latin/quicksand-v
 import * as QuicksandRegularWoff from "./../../fonts/quicksand-v7-latin/quicksand-v7-latin-regular.woff";
 import * as QuicksandRegularWoff2 from "./../../fonts/quicksand-v7-latin/quicksand-v7-latin-regular.woff2";
 
-injectGlobal`
+const GlobalFonts = css`
   /* quicksand-300 - latin */
   @font-face {
-    font-family: 'Quicksand';
+    font-family: "Quicksand";
     font-style: normal;
     font-weight: 300;
-    src: local('Quicksand Light'), local('Quicksand-Light'),
-        url(${Quicksand300Woff2}) format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
-        url(${Quicksand300Woff}) format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+    src: local("Quicksand Light"), local("Quicksand-Light"), url(${Quicksand300Woff2}) format("woff2"),
+      /* Chrome 26+, Opera 23+, Firefox 39+ */ url(${Quicksand300Woff}) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
   }
   /* quicksand-regular - latin */
   @font-face {
-    font-family: 'Quicksand';
+    font-family: "Quicksand";
     font-style: normal;
     font-weight: 400;
-    src: local('Quicksand Regular'), local('Quicksand-Regular'),
-        url(${QuicksandRegularWoff2}) format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
-        url(${QuicksandRegularWoff}) format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+    src: local("Quicksand Regular"), local("Quicksand-Regular"), url(${QuicksandRegularWoff2}) format("woff2"),
+      /* Chrome 26+, Opera 23+, Firefox 39+ */ url(${QuicksandRegularWoff}) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
   }
   /* quicksand-500 - latin */
   @font-face {
-    font-family: 'Quicksand';
+    font-family: "Quicksand";
     font-style: normal;
     font-weight: 500;
-    src: local('Quicksand Medium'), local('Quicksand-Medium'),
-        url(${Quicksand500Woff2}) format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
-        url(${Quicksand500Woff}) format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+    src: local("Quicksand Medium"), local("Quicksand-Medium"), url(${Quicksand500Woff2}) format("woff2"),
+      /* Chrome 26+, Opera 23+, Firefox 39+ */ url(${Quicksand500Woff}) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
   }
   /* quicksand-700 - latin */
   @font-face {
-    font-family: 'Quicksand';
+    font-family: "Quicksand";
     font-style: normal;
     font-weight: 700;
-    src: local('Quicksand Bold'), local('Quicksand-Bold'),
-        url(${Quicksand700Woff2}) format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
-        url(${Quicksand700Woff}) format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+    src: local("Quicksand Bold"), local("Quicksand-Bold"), url(${Quicksand700Woff2}) format("woff2"),
+      /* Chrome 26+, Opera 23+, Firefox 39+ */ url(${Quicksand700Woff}) format("woff"); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
   }
 
   body {
@@ -51,3 +47,5 @@ injectGlobal`
     font-weight: 400;
   }
 `;
+
+export default GlobalFonts;
diff --git a/frontend/src/commons/style.ts b/frontend/src/commons/style.ts
index 8b4e99553..0c8cdec25 100644
--- a/frontend/src/commons/style.ts
+++ b/frontend/src/commons/style.ts
@@ -1,4 +1,5 @@
-import { injectGlobal } from "styled-components";
+import { createGlobalStyle, css } from "styled-components";
+import GlobalFonts from "./font";
 
 const breakpoints = {
   mobile: "40.0rem",
@@ -10,7 +11,7 @@ export const media = {
   tablet: `screen and (min-width: ${breakpoints.mobile}) and (max-width: ${breakpoints.tablet})`
 };
 
-export const title = `
+export const title = css`
   padding-top: 2rem;
   padding-bottom: 1rem;
   font-size: 1.5rem;
@@ -18,27 +19,32 @@ export const title = `
   color: #00afec;
 `;
 
-export const goodSpace = `
-display: box;
-display: -webkit-box;
-display: -moz-box;
-display: -o-box;
-display: -ms-box;
-box-pack: justify;
--moz-box-pack: justify;
--webkit-box-pack: justify;
--o-box-pack: justify;
--ms-box-pack: justify;
+export const goodSpace = css`
+  display: box;
+  display: -webkit-box;
+  display: -moz-box;
+  display: -o-box;
+  display: -ms-box;
+  box-pack: justify;
+  -moz-box-pack: justify;
+  -webkit-box-pack: justify;
+  -o-box-pack: justify;
+  -ms-box-pack: justify;
 `;
 
-injectGlobal`
-  *, *:before, *:after {
+const GlobalStyle = createGlobalStyle`
+  ${GlobalFonts}
+
+  *,
+  *:before,
+  *:after {
     -webkit-box-sizing: border-box;
-       -moz-box-sizing: border-box;
-         -o-box-sizing: border-box;
-        -ms-box-sizing: border-box;
-            box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    -o-box-sizing: border-box;
+    -ms-box-sizing: border-box;
+    box-sizing: border-box;
   }
+
   a {
     text-decoration: none;
   }
@@ -47,3 +53,5 @@ injectGlobal`
     display: inline;
   }
 `;
+
+export default GlobalStyle;
diff --git a/frontend/src/components/AboutBottom.tsx b/frontend/src/components/AboutBottom.tsx
index 3f00abea2..e604b38ca 100644
--- a/frontend/src/components/AboutBottom.tsx
+++ b/frontend/src/components/AboutBottom.tsx
@@ -1,10 +1,9 @@
 import * as React from "react";
 import styled from "styled-components";
 
-import { Link } from "react-router-dom";
 import { media } from "./../commons/style";
-import { ChkButtonBase } from "./../commons/ChkButtonBase";
 import { chkColors } from "./../commons/color";
+import ChkButtonBase from "./../commons/ChkButtonBase";
 
 import * as img from "./../../images/bg.jpg";
 
@@ -16,9 +15,9 @@ export const AboutBottom = () => (
         <ParagraphStyle>
           インキュベーションワークが始まった2015年頃から、呉高専の学生は縦のつながりと横のつながりが広がっていきました。しかし、まだ多くの学生は同じクラス、部活動の友だちなどのコミュニティで完結してしまっています。私たちはこれまで多様な人とつながったことで、将来の選択肢が増えていきました。後輩たちにも同じようにもっとたくさんの人とつながりを作って、多くの経験をしてほしいという想いから、この活動を開始しました。
         </ParagraphStyle>
-        <ToContact to="/contact">
-          <ButtonStyle>contact</ButtonStyle>
-        </ToContact>
+        <ButtonWrapper>
+          <ButtonStyle to="/contact" text="contact" />
+        </ButtonWrapper>
       </ContentStyle>
     </MaskStyle>
   </AboutBottomStyle>
@@ -62,11 +61,9 @@ const ParagraphStyle = styled.p`
   line-height: 1.42em;
 `;
 
-const ButtonStyle = ChkButtonBase.extend`
+const ButtonWrapper = styled.div`
   margin: 80px auto 0;
   width: 40%;
 `;
 
-const ToContact = styled(Link)`
-  text-decoration: "none";
-`;
+const ButtonStyle = styled(ChkButtonBase)``;
diff --git a/frontend/src/components/AboutSidebar.tsx b/frontend/src/components/AboutSidebar.tsx
index 498a7c993..039210230 100644
--- a/frontend/src/components/AboutSidebar.tsx
+++ b/frontend/src/components/AboutSidebar.tsx
@@ -16,7 +16,6 @@ export const AboutSidebar = () => (
 
 const AboutSidebarStyle = styled.div`
   width: 100%;
-  padding: 0 20px;
   height: 400px;
 `;
 
diff --git a/frontend/src/components/ChkSlider.tsx b/frontend/src/components/ChkSlider.tsx
index e6d96cacb..475b0bf5a 100644
--- a/frontend/src/components/ChkSlider.tsx
+++ b/frontend/src/components/ChkSlider.tsx
@@ -4,11 +4,11 @@ import Slider from "react-slick";
 import "slick-carousel/slick/slick.css";
 import "../../css/ChkSlider.css";
 
-export interface Props {
+export interface IProps {
   InnerComponent: any;
 }
 
-export const ChkSlider = (props: Props) => <Slider {...settings}>{props.InnerComponent}</Slider>;
+export const ChkSlider = (props: IProps) => <Slider {...settings}>{props.InnerComponent}</Slider>;
 
 const ChkNextArrow = (props: any) => {
   const { className, onClick } = props;
diff --git a/frontend/src/components/ContactForm.tsx b/frontend/src/components/ContactForm.tsx
index 29f0d94ad..f10f57719 100644
--- a/frontend/src/components/ContactForm.tsx
+++ b/frontend/src/components/ContactForm.tsx
@@ -4,13 +4,13 @@ import { ChkButtonBase } from "../commons/ChkButtonBase";
 import { chkColors } from "../commons/color";
 import ContactStore from "../stores/ContactStore";
 
-type Prop = {
+interface Prop {
   contactStore: ContactStore;
   successed: (res: object) => void;
   failed: (res: object) => void;
-};
+}
 
-type State = {
+interface State {
   name: string;
   corner?: number;
   department?: number;
@@ -19,7 +19,7 @@ type State = {
   nickname: string;
   message: string;
   readable: boolean;
-};
+}
 
 export default class ContactForm extends React.Component<Prop, State> {
   constructor(props: Prop) {
@@ -32,13 +32,13 @@ export default class ContactForm extends React.Component<Prop, State> {
       email: "",
       nickname: "",
       message: "",
-      readable: false,
+      readable: false
     };
 
     this.createContact = this.createContact.bind(this);
   }
 
-  render() {
+  public render() {
     return (
       <form onSubmit={this.createContact}>
         <ContactFormInputWrapper>
@@ -141,7 +141,7 @@ export default class ContactForm extends React.Component<Prop, State> {
     );
   }
 
-  createContact(e: any) {
+  public createContact(e: any) {
     e.preventDefault();
 
     const { contactStore } = this.props;
diff --git a/frontend/src/components/FeaturedBlog.tsx b/frontend/src/components/FeaturedBlog.tsx
new file mode 100644
index 000000000..694e24852
--- /dev/null
+++ b/frontend/src/components/FeaturedBlog.tsx
@@ -0,0 +1,95 @@
+import * as React from "react";
+import { Link } from "react-router-dom";
+import styled from "styled-components";
+
+import { chkColors } from "./../commons/color";
+
+import * as img from "./../../images/apple-2385198_1280-1.jpg";
+import * as chanyou from "./../../images/chanyou.jpg";
+
+export interface IProps {
+  title: string;
+  date: string;
+  summary: string;
+  author: string;
+  to: string;
+}
+export const FeaturedBlog = (props: IProps) => {
+  const { title, date, summary, author, to } = props;
+
+  return (
+    <Link to={to}>
+      <Wrapper>
+        <PictureWrapper>
+          <Picture src={img} />
+        </PictureWrapper>
+        <Article>
+          <Title>{title}</Title>
+          <Contents>
+            <p>{summary}</p>
+            <Meta>
+              <span>{date}</span>
+              <Icon src={chanyou} />
+              <span>{author}</span>
+            </Meta>
+          </Contents>
+        </Article>
+      </Wrapper>
+    </Link>
+  );
+};
+
+const Wrapper = styled.div`
+  display: flex;
+  width: 100%;
+  margin: 20px 0;
+`;
+
+const PictureWrapper = styled.div`
+  width: 230px;
+`;
+
+const Picture = styled.img`
+  width: 200px;
+  height: 100%;
+  object-fit: cover;
+  border-radius: 10px;
+  border: solid 1px ${chkColors.orange};
+`;
+
+const Article = styled.div`
+  flex: 1;
+`;
+
+const Title = styled.h3`
+  margin: 0;
+  margin-bottom: 20px;
+  font-size: 1.3rem;
+  color: ${chkColors.white};
+`;
+
+const Contents = styled.div`
+  display: flex;
+  flex-direction: column;
+  flex-wrap: wrap;
+  justify-content: center;
+  align-items: left;
+
+  color: ${chkColors.white};
+  word-break: break-all;
+`;
+
+const Meta = styled.div`
+  color: ${chkColors.darkenAqua};
+  font-weight: bold;
+`;
+
+const Icon = styled.img`
+  height: 35px;
+  width: 35px;
+  border-radius: 50%;
+  border: solid 1px ${chkColors.orange};
+  object-fit: cover;
+  margin: 0 10px;
+  vertical-align: middle;
+`;
diff --git a/frontend/src/components/FeaturedBlogWrapper.tsx b/frontend/src/components/FeaturedBlogWrapper.tsx
index 41389c8f9..be9fccbd3 100644
--- a/frontend/src/components/FeaturedBlogWrapper.tsx
+++ b/frontend/src/components/FeaturedBlogWrapper.tsx
@@ -1,11 +1,62 @@
 import * as React from "react";
 import styled from "styled-components";
 
-export const FeaturedBlogWrapper = () => <FeaturedBlogWrapperStyle>featured-blog-wrapper</FeaturedBlogWrapperStyle>;
+import { chkColors } from "./../commons/color";
 
-const FeaturedBlogWrapperStyle = styled.div`
-  width: 100%;
-  color: white;
-  background-color: #242424;
-  height: 600px;
+import MoreButton from "./MoreButton";
+
+import { FeaturedBlog } from "./FeaturedBlog";
+
+export const FeaturedBlogWrapper = () => (
+  <Wrapper>
+    <Title>BLOG</Title>
+    <BlogWrapper>
+      <FeaturedBlog
+        title="news title"
+        date="YYYY/MM/DD"
+        summary="人の世界は住みにくい人の世界は住みにくい人の世界は住みにくい。
+        人の世界は住みにくい人の世界は住みにくい人の世界は住みにくい。"
+        author="だれかさん"
+        to="/blog"
+      />
+      <FeaturedBlog
+        title="news title"
+        date="YYYY/MM/DD"
+        summary="人の世界は住みにくい人の世界は住みにくい人の世界は住みにくい。
+        人の世界は住みにくい人の世界は住みにくい人の世界は住みにくい。"
+        author="だれかさん"
+        to="/blog"
+      />
+      <FeaturedBlog
+        title="news title"
+        date="YYYY/MM/DD"
+        summary="人の世界は住みにくい人の世界は住みにくい人の世界は住みにくい。
+        人の世界は住みにくい人の世界は住みにくい人の世界は住みにくい。"
+        author="だれかさん"
+        to="/blog"
+      />
+    </BlogWrapper>
+    <MoreButton to="/blog" />
+  </Wrapper>
+);
+
+const Wrapper = styled.div`
+  background-color: ${chkColors.aqua};
+  margin: 10px;
+  padding: 50px 40px;
+  border-radius: 8px;
+`;
+
+const Title = styled.h1`
+  font-size: 1.5rem;
+  text-align: center;
+  color: ${chkColors.white};
+`;
+
+const BlogWrapper = styled.div`
+  display: flex;
+  flex-direction: column;
+  flex-wrap: wrap;
+  justify-content: center;
+  align-items: center;
 `;
diff --git a/frontend/src/components/FeaturedPersonalityButton.tsx b/frontend/src/components/FeaturedPersonalityButton.tsx
index 03827ff54..c1a3b129a 100644
--- a/frontend/src/components/FeaturedPersonalityButton.tsx
+++ b/frontend/src/components/FeaturedPersonalityButton.tsx
@@ -1,16 +1,15 @@
 import * as React from "react";
+import styled from "styled-components";
 
-import { ChkButtonBase } from "./../commons/ChkButtonBase";
-import { chkColors } from "./../commons/color";
+import ChkButtonBase from "../commons/ChkButtonBase";
 
-export const FeaturedPersonalityButton = () => <PersonalityButton>personality list</PersonalityButton>;
+export const FeaturedPersonalityButton = () => (
+  <Wrapper>
+    <ChkButtonBase to="/personality" text="personality list" />
+  </Wrapper>
+);
 
-const PersonalityButton = ChkButtonBase.extend`
-  background-color: ${chkColors.orange};
+const Wrapper = styled.div`
+  margin: 0 auto;
   width: 210px;
-  height: 48px;
-  margin-top: 40px;
-  margin-left: auto;
-  margin-right: auto;
-  border-radius: 20px;
 `;
diff --git a/frontend/src/components/FeaturedPersonalityListenToRadioButton.tsx b/frontend/src/components/FeaturedPersonalityListenToRadioButton.tsx
index 5152b949a..36c88f353 100644
--- a/frontend/src/components/FeaturedPersonalityListenToRadioButton.tsx
+++ b/frontend/src/components/FeaturedPersonalityListenToRadioButton.tsx
@@ -1,14 +1,16 @@
 import * as React from "react";
+import styled from "styled-components";
 
-import { ChkButtonBase } from "./../commons/ChkButtonBase";
-import { chkColors } from "./../commons/color";
+import ChkButtonBase from "../commons/ChkButtonBase";
 
-export const FeaturedPersonalityListenToRadioButton = () => <ListenToButton>listen to radio</ListenToButton>;
+export const FeaturedPersonalityListenToRadioButton = () => (
+  <Wrapper>
+    <ChkButtonBase to="/" text="listen to radio" bgcolor="blue" />
+  </Wrapper>
+);
 
-const ListenToButton = ChkButtonBase.extend`
-  background-color: ${chkColors.blue};
+const Wrapper = styled.div`
+  margin: 0 auto;
   height: 35px;
   width: 60%;
-  margin: 0 auto;
-  border-radius: 20px;
 `;
diff --git a/frontend/src/components/HeroArea.tsx b/frontend/src/components/HeroArea.tsx
index fc2e88b59..e91030ac4 100644
--- a/frontend/src/components/HeroArea.tsx
+++ b/frontend/src/components/HeroArea.tsx
@@ -3,11 +3,11 @@ import styled from "styled-components";
 
 import * as img from "./../../images/hero.jpg";
 
-export interface Props {
+export interface IProps {
   InnerComponent: string | React.ReactNode;
 }
 
-export const HeroArea = (props: Props) => <HeroAreaStyle>{props.InnerComponent}</HeroAreaStyle>;
+export const HeroArea = (props: IProps) => <HeroAreaStyle>{props.InnerComponent}</HeroAreaStyle>;
 
 const HeroAreaStyle = styled.div`
   width: 100%;
diff --git a/frontend/src/components/MoreButton.tsx b/frontend/src/components/MoreButton.tsx
new file mode 100644
index 000000000..a416c00d6
--- /dev/null
+++ b/frontend/src/components/MoreButton.tsx
@@ -0,0 +1,25 @@
+import * as React from "react";
+import styled from "styled-components";
+
+import ChkButtonBase from "./../commons/ChkButtonBase";
+
+interface IProps {
+  to: string;
+}
+
+const MoreButton = (props: IProps) => {
+  const { to } = props;
+
+  return (
+    <MoreButtonWrapper>
+      <ChkButtonBase text="more" to={to} />
+    </MoreButtonWrapper>
+  );
+};
+
+const MoreButtonWrapper = styled.div`
+  margin: 0 auto;
+  width: 150px;
+`;
+
+export default MoreButton;
diff --git a/frontend/src/components/PopularRadioCard.tsx b/frontend/src/components/PopularRadioCard.tsx
new file mode 100644
index 000000000..e1d8fd29b
--- /dev/null
+++ b/frontend/src/components/PopularRadioCard.tsx
@@ -0,0 +1,49 @@
+import * as React from "react";
+import styled from "styled-components";
+
+import { chkColors } from "./../commons/color";
+
+interface IProps {
+  title: string;
+  img: string;
+  description: string;
+}
+
+export const PopularRadioCard = (props: IProps) => (
+  <Wrapper>
+    <RadioImg src={props.img} />
+    <RadioProperties>
+      <RadioTitle>{props.title}</RadioTitle>
+      <RadioDescription>{props.description}</RadioDescription>
+    </RadioProperties>
+  </Wrapper>
+);
+
+const Wrapper = styled.div`
+  width: 100%;
+  height: 100%;
+  min-height: 120px;
+  display: flex;
+`;
+
+const RadioImg = styled.img`
+  width: 120px;
+  height: auto;
+  align-self: flex-start;
+`;
+
+const RadioProperties = styled.div`
+  height: auto;
+`;
+
+const RadioTitle = styled.div`
+  color: ${chkColors.orange};
+  font-size: 1rem;
+`;
+
+const RadioDescription = styled.p`
+  color: ${chkColors.gray};
+  font-size: 0.9rem;
+  margin-top: 6px;
+  text-indent: 0.9rem;
+`;
diff --git a/frontend/src/components/PopularRadioWrapper.tsx b/frontend/src/components/PopularRadioWrapper.tsx
index a39243f39..484bce39b 100644
--- a/frontend/src/components/PopularRadioWrapper.tsx
+++ b/frontend/src/components/PopularRadioWrapper.tsx
@@ -1,11 +1,51 @@
 import * as React from "react";
 import styled from "styled-components";
 
-export const PopularRadioWrapper = () => <PopularRadioWrapperStyle>popular-radio-wrapper</PopularRadioWrapperStyle>;
+import { title } from "./../commons/style";
+import { chkColors } from "./../commons/color";
+
+import * as sidebarRadioImg from "./../../images/sidebar-radio-img.png";
+import MoreButton from "./MoreButton";
+import { PopularRadioCard } from "./PopularRadioCard";
+
+export const PopularRadioWrapper = () => (
+  <PopularRadioWrapperStyle>
+    <Title>popular radio</Title>
+    <PopularRadioCardWrapper>
+      <PopularRadioCard
+        title="#50 ヤマトーーク!"
+        img={sidebarRadioImg}
+        description="エナジードリンク、お年玉の使い道、登山、Advent Calendar、エディタ、LTalksなどの話をしました。"
+      />
+      <PopularRadioCard
+        title="#50 ヤマトーーク!"
+        img={sidebarRadioImg}
+        description="エナジードリンク、お年玉の使い道、登山、Advent Calendar、エディタ、LTalksなどの話をしました。"
+      />
+      <PopularRadioCard
+        title="#50 ヤマトーーク!"
+        img={sidebarRadioImg}
+        description="エナジードリンク、お年玉の使い道、登山、Advent Calendar、エディタ、LTalksなどの話をしました。"
+      />
+    </PopularRadioCardWrapper>
+    <MoreButton to="/radios" />
+  </PopularRadioWrapperStyle>
+);
 
 const PopularRadioWrapperStyle = styled.div`
   width: 100%;
-  color: black;
-  background-color: #f1f0ee;
-  height: 400px;
+  color: white;
+  background-color: ${chkColors.white};
+  height: auto;
+`;
+
+const Title = styled.div`
+  ${title}
+  color: ${chkColors.blue};
+  padding: 10px 20px;
+`;
+
+const PopularRadioCardWrapper = styled.div`
+  width: auto;
+  height: auto;
 `;
diff --git a/frontend/src/components/RadioHistoryContentWrapper.tsx b/frontend/src/components/RadioHistoryContentWrapper.tsx
index c41af5c20..c06b0b522 100644
--- a/frontend/src/components/RadioHistoryContentWrapper.tsx
+++ b/frontend/src/components/RadioHistoryContentWrapper.tsx
@@ -2,9 +2,9 @@ import * as React from "react";
 import styled from "styled-components";
 
 import { title, goodSpace } from "./../commons/style";
-import { ChkButtonBase } from "./../commons/ChkButtonBase";
 import { chkColors } from "./../commons/color";
 
+import MoreButton from "./MoreButton";
 import { RadioCardWrapper } from "./../components/RadioCardWrapper";
 import { RadioHistoryFeature } from "./../components/RadioHistoryFeature";
 
@@ -42,7 +42,7 @@ export const RadioHistoryContentWrapper = () => (
         <RadioCardWrapper />
         <RadioCardWrapper />
       </RadioCardsWrapper>
-      <MoreButton>more</MoreButton>
+      <MoreButton to="" />
     </RadioHistoryContentArea>
   </Wrapper>
 );
@@ -57,16 +57,16 @@ const RadioHistoryContentArea = styled.div`
 `;
 
 const Title = styled.div`
-  ${title};
+  ${title}
   color: ${chkColors.gray};
   text-align: center;
   margin-bottom: 20px;
 `;
 
 const RadioDateButtonWrapper = styled.div`
+  ${goodSpace}
   width: 45%;
   margin: 0 auto 20px auto;
-  ${goodSpace};
 `;
 
 const RadioDateButton = styled.button`
@@ -81,15 +81,6 @@ const RadioDateButton = styled.button`
 `;
 
 const RadioCardsWrapper = styled.div`
+  ${goodSpace}
   margin: 0 auto 20px auto;
-  ${goodSpace};
-`;
-
-const MoreButton = ChkButtonBase.extend`
-  margin: 20px auto 0 auto;
-  padding: 5px 1rem;
-  width: 20%;
-  line-height: 1.5rem;
-  border-radius: 1.5rem;
-  background-color: ${chkColors.orange};
 `;
diff --git a/frontend/src/components/RadioSearcher.tsx b/frontend/src/components/RadioSearcher.tsx
index 5cb058d70..3e69f869d 100644
--- a/frontend/src/components/RadioSearcher.tsx
+++ b/frontend/src/components/RadioSearcher.tsx
@@ -2,8 +2,8 @@ import * as React from "react";
 import styled from "styled-components";
 
 import { title } from "./../commons/style";
-import { ChkButtonBase } from "./../commons/ChkButtonBase";
 import { chkColors } from "./../commons/color";
+import ChkButtonBase from "../commons/ChkButtonBase";
 
 export const RadioSearcher = () => (
   <Wrapper>
@@ -19,28 +19,18 @@ export const RadioSearcher = () => (
         <RadioSearchInput name="what" type="text" placeholder="どんなこと" />
       </RadioSearchInputWrapper>
       <RadioSearchTagButtonWrapper>
-        <RadioSearchTagButton name="tag1" type="button">
-          tag1
-        </RadioSearchTagButton>
-        <RadioSearchTagButton name="tag2" type="button">
-          tag2
-        </RadioSearchTagButton>
-        <RadioSearchTagButton name="tag3" type="button">
-          tag3
-        </RadioSearchTagButton>
+        <RadioSearchTagButton name="tag1" text="tag1" color="blue" bgcolor="white" border="blue" />
+        <RadioSearchTagButton name="tag2" text="tag2" color="blue" bgcolor="white" border="blue" />
+        <RadioSearchTagButton name="tag3" text="tag3" color="blue" bgcolor="white" border="blue" />
       </RadioSearchTagButtonWrapper>
       <RadioSearchTagButtonWrapper>
-        <RadioSearchTagButton name="tag4" type="button">
-          tag4
-        </RadioSearchTagButton>
-        <RadioSearchTagButton name="tag5" type="button">
-          tag5
-        </RadioSearchTagButton>
-        <RadioSearchTagButton name="tag6" type="button">
-          tag6
-        </RadioSearchTagButton>
+        <RadioSearchTagButton name="tag4" text="tag4" color="blue" bgcolor="white" border="blue" />
+        <RadioSearchTagButton name="tag5" text="tag5" color="blue" bgcolor="white" border="blue" />
+        <RadioSearchTagButton name="tag6" text="tag6" color="blue" bgcolor="white" border="blue" />
       </RadioSearchTagButtonWrapper>
-      <RadioSearchButton>Search</RadioSearchButton>
+      <RadioSearchButtonWrapper>
+        <RadioSearchButton text="Search" />
+      </RadioSearchButtonWrapper>
     </form>
   </Wrapper>
 );
@@ -54,7 +44,7 @@ const Wrapper = styled.div`
 `;
 
 const RadioSearcherTitle = styled.div`
-  ${title};
+  ${title}
   color: ${chkColors.blue};
 `;
 
@@ -81,36 +71,16 @@ const RadioSearchInput = styled.input`
 `;
 
 const RadioSearchTagButtonWrapper = styled.div`
-  width: 100%;
-  margin: 0 auto 10px auto;
-  display: box;
-  display: -webkit-box;
-  display: -moz-box;
-  display: -o-box;
-  display: -ms-box;
-  box-pack: justify;
-  -moz-box-pack: justify;
-  -webkit-box-pack: justify;
-  -o-box-pack: justify;
-  -ms-box-pack: justify;
+  display: flex;
+  margin-bottom: 10px;
 `;
 
-const RadioSearchTagButton = styled.button`
-  display: block;
-  padding: 5px 1rem;
-  line-height: 1.5rem;
-  color: ${chkColors.blue};
-  border: 2px solid ${chkColors.blue};
-  background-color: #fff;
-  border-radius: 1.5rem;
-  outline: none;
-`;
+const RadioSearchTagButton = styled(ChkButtonBase)``;
 
-const RadioSearchButton = ChkButtonBase.extend`
-  margin: 20px auto 0 auto;
-  padding: 5px 1rem;
+const RadioSearchButtonWrapper = styled.div`
+  margin-top: 20px;
+  margin: 0 auto;
   width: 50%;
-  line-height: 1.5rem;
-  border-radius: 1.5rem;
-  background-color: ${chkColors.orange};
 `;
+
+const RadioSearchButton = styled(ChkButtonBase)``;
diff --git a/frontend/src/entries/Contact.tsx b/frontend/src/entries/Contact.tsx
index d17b58aeb..d9bdeb44b 100644
--- a/frontend/src/entries/Contact.tsx
+++ b/frontend/src/entries/Contact.tsx
@@ -2,6 +2,7 @@ import * as React from "react";
 import styled from "styled-components";
 
 import { media } from "../commons/style";
+import ChkButtonBase from "../commons/ChkButtonBase";
 
 import { HeroArea } from "../components/HeroArea";
 import { ContactHeroContent } from "../components/ContactHeroContent";
diff --git a/frontend/src/entries/Index.tsx b/frontend/src/entries/Index.tsx
index 7005c6c71..f618a2d87 100644
--- a/frontend/src/entries/Index.tsx
+++ b/frontend/src/entries/Index.tsx
@@ -38,7 +38,8 @@ const Contrainer = styled.div`
 `;
 
 const Sidebar = styled.nav`
-  flex: 0 0 20%;
+  flex: 0 0 25%;
+  padding: 0 20px;
 
   @media ${media.mobile} {
     flex: 0 0 0%;
@@ -47,7 +48,7 @@ const Sidebar = styled.nav`
 `;
 
 const MainContentWrapper = styled.div`
-  flex: 0 0 80%;
+  flex: 0 0 75%;
 
   @media ${media.mobile} {
     flex: 0 0 100%;
diff --git a/frontend/src/index.tsx b/frontend/src/index.tsx
index d17cd30b4..2c41b94e0 100644
--- a/frontend/src/index.tsx
+++ b/frontend/src/index.tsx
@@ -1,10 +1,10 @@
-require("normalize.css");
-require("./commons/font");
+import "normalize.css";
 
 import * as React from "react";
 import * as ReactDOM from "react-dom";
 import { BrowserRouter } from "react-router-dom";
 import { Provider } from "mobx-react";
+import GlobalStyle from "./commons/style";
 
 import { App } from "./App";
 import RootStore from "./stores/RootStore";
@@ -13,7 +13,10 @@ import RootStore from "./stores/RootStore";
 ReactDOM.render(
   <Provider rootStore={new RootStore("http://localhost:3000")}>
     <BrowserRouter basename="/app">
-      <App />
+      <>
+        <App />
+        <GlobalStyle />
+      </>
     </BrowserRouter>
   </Provider>,
   document.getElementById("app")
diff --git a/frontend/src/models/ContactModel.ts b/frontend/src/models/ContactModel.ts
index 098273c48..32398d12e 100644
--- a/frontend/src/models/ContactModel.ts
+++ b/frontend/src/models/ContactModel.ts
@@ -2,17 +2,17 @@ import { computed } from "mobx";
 import ContactStore from "../stores/ContactStore";
 
 export default class ContactModel {
-  store: ContactStore;
+  public store: ContactStore;
 
-  id: number;
-  readable: boolean;
-  corner: number;
-  message: string;
-  nickname?: string;
-  name?: string;
-  email: string;
-  department: number;
-  grade: number;
+  public id: number;
+  public readable: boolean;
+  public corner: number;
+  public message: string;
+  public nickname?: string;
+  public name?: string;
+  public email: string;
+  public department: number;
+  public grade: number;
 
   constructor(store: ContactStore, json: any) {
     this.store = store;
@@ -29,7 +29,7 @@ export default class ContactModel {
     this.grade = grade;
   }
 
-  save(successed: (res: object) => void, failed: (res: object) => void) {
+  public save(successed: (res: object) => void, failed: (res: object) => void) {
     console.log(this.toJson);
     return this.store.transportLayer.saveContact(this.toJson, successed, failed);
   }
@@ -45,7 +45,7 @@ export default class ContactModel {
       name: this.name,
       email: this.email,
       department: this.department,
-      grade: this.grade,
+      grade: this.grade
     };
   }
 }
diff --git a/frontend/src/stores/ContactStore.ts b/frontend/src/stores/ContactStore.ts
index 1ad536d00..0648be0c7 100644
--- a/frontend/src/stores/ContactStore.ts
+++ b/frontend/src/stores/ContactStore.ts
@@ -2,13 +2,13 @@ import ContactApi from "../api/ContactApi";
 import ContactModel from "../models/ContactModel";
 
 export default class ContactStore {
-  transportLayer: ContactApi;
+  public transportLayer: ContactApi;
 
   constructor(transportLayer: ContactApi) {
     this.transportLayer = transportLayer;
   }
 
-  createContact(json: object) {
+  public createContact(json: object) {
     return new ContactModel(this, json);
   }
 }
diff --git a/frontend/src/stores/RootStore.ts b/frontend/src/stores/RootStore.ts
index 25812464c..a610cbbbc 100644
--- a/frontend/src/stores/RootStore.ts
+++ b/frontend/src/stores/RootStore.ts
@@ -3,7 +3,7 @@ import ContactApi from "../api/ContactApi";
 import RestClient from "../api/RestClient";
 
 export default class RootStore {
-  contactStore: ContactStore;
+  public contactStore: ContactStore;
 
   constructor(baseUrl: string) {
     const restClient = new RestClient(baseUrl);
diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json
index 0e143098b..82d18fc02 100644
--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@@ -3,7 +3,7 @@
     "sourceMap": true,
     "noImplicitAny": true,
     "module": "commonjs",
-    "target": "es2017",
+    "target": "es2018",
     "jsx": "react",
     "typeRoots": ["node_modules/@types", "src/typings"],
     "strict": true,
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index dfad92a3a..143df6b3b 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -2,6 +2,40 @@
 # yarn lockfile v1
 
 
+"@babel/helper-annotate-as-pure@^7.0.0":
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.0.0.tgz#323d39dd0b50e10c7c06ca7d7638e6864d8c5c32"
+  dependencies:
+    "@babel/types" "^7.0.0"
+
+"@babel/helper-module-imports@^7.0.0":
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.0.0.tgz#96081b7111e486da4d2cd971ad1a4fe216cc2e3d"
+  dependencies:
+    "@babel/types" "^7.0.0"
+
+"@babel/types@^7.0.0":
+  version "7.3.0"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.3.0.tgz#61dc0b336a93badc02bf5f69c4cd8e1353f2ffc0"
+  dependencies:
+    esutils "^2.0.2"
+    lodash "^4.17.10"
+    to-fast-properties "^2.0.0"
+
+"@emotion/is-prop-valid@^0.7.3":
+  version "0.7.3"
+  resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-0.7.3.tgz#a6bf4fa5387cbba59d44e698a4680f481a8da6cc"
+  dependencies:
+    "@emotion/memoize" "0.7.1"
+
+"@emotion/memoize@0.7.1":
+  version "0.7.1"
+  resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.1.tgz#e93c13942592cf5ef01aa8297444dc192beee52f"
+
+"@emotion/unitless@^0.7.0":
+  version "0.7.3"
+  resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.7.3.tgz#6310a047f12d21a1036fb031317219892440416f"
+
 "@mrmlnc/readdir-enhanced@^2.2.1":
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/@mrmlnc/readdir-enhanced/-/readdir-enhanced-2.2.1.tgz#524af240d1a360527b730475ecfa1344aa540dde"
@@ -24,45 +58,57 @@
   resolved "https://registry.yarnpkg.com/@sindresorhus/is/-/is-0.7.0.tgz#9a06f4f137ee84d7df0460c1fdb1135ffa6c50fd"
 
 "@types/history@*":
-  version "4.6.2"
-  resolved "https://registry.yarnpkg.com/@types/history/-/history-4.6.2.tgz#12cfaba693ba20f114ed5765467ff25fdf67ddb0"
+  version "4.7.2"
+  resolved "https://registry.yarnpkg.com/@types/history/-/history-4.7.2.tgz#0e670ea254d559241b6eeb3894f8754991e73220"
 
 "@types/node@*":
-  version "10.3.0"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-10.3.0.tgz#078516315a84d56216b5d4fed8f75d59d3b16cac"
+  version "10.12.18"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-10.12.18.tgz#1d3ca764718915584fcd9f6344621b7672665c67"
+
+"@types/prop-types@*":
+  version "15.5.8"
+  resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.5.8.tgz#8ae4e0ea205fe95c3901a5a1df7f66495e3a56ce"
 
 "@types/react-dom@^16.0.5":
-  version "16.0.5"
-  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.0.5.tgz#a757457662e3819409229e8f86795ff37b371f96"
+  version "16.0.11"
+  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.0.11.tgz#bd10ccb0d9260343f4b9a49d4f7a8330a5c1f081"
   dependencies:
-    "@types/node" "*"
     "@types/react" "*"
 
 "@types/react-router-dom@^4.2.7":
-  version "4.2.7"
-  resolved "https://registry.yarnpkg.com/@types/react-router-dom/-/react-router-dom-4.2.7.tgz#9d36bfe175f916dd8d7b6b0237feed6cce376b4c"
+  version "4.3.1"
+  resolved "https://registry.yarnpkg.com/@types/react-router-dom/-/react-router-dom-4.3.1.tgz#71fe2918f8f60474a891520def40a63997dafe04"
   dependencies:
     "@types/history" "*"
     "@types/react" "*"
     "@types/react-router" "*"
 
 "@types/react-router@*":
-  version "4.0.26"
-  resolved "https://registry.yarnpkg.com/@types/react-router/-/react-router-4.0.26.tgz#4489c873642baa633014294a6d0a290001ba9860"
+  version "4.4.3"
+  resolved "https://registry.yarnpkg.com/@types/react-router/-/react-router-4.4.3.tgz#ea68b4021cb576866f83365b2201411537423d50"
   dependencies:
     "@types/history" "*"
     "@types/react" "*"
 
-"@types/react-slick@^0.23.1":
-  version "0.23.1"
-  resolved "https://registry.yarnpkg.com/@types/react-slick/-/react-slick-0.23.1.tgz#fcc1beaad47c4e8b6da02b6568e1430bf8790a0b"
+"@types/react-slick@^0.23.4":
+  version "0.23.4"
+  resolved "https://registry.yarnpkg.com/@types/react-slick/-/react-slick-0.23.4.tgz#c97e2a9e7e3d1933c68593b8e82752fab1e8ce53"
   dependencies:
     "@types/react" "*"
 
 "@types/react@*", "@types/react@^16.3.16":
-  version "16.3.16"
-  resolved "https://registry.yarnpkg.com/@types/react/-/react-16.3.16.tgz#78fc44a90b45701f50c8a7008f733680ba51fc86"
+  version "16.7.20"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-16.7.20.tgz#13ae752c012710d0fa800985ca809814b51d3b58"
   dependencies:
+    "@types/prop-types" "*"
+    csstype "^2.2.0"
+
+"@types/styled-components@^4.1.6":
+  version "4.1.6"
+  resolved "https://registry.yarnpkg.com/@types/styled-components/-/styled-components-4.1.6.tgz#9aa1d47dbc6bae540083869bcc6c639c6e9af0fe"
+  dependencies:
+    "@types/node" "*"
+    "@types/react" "*"
     csstype "^2.2.0"
 
 "@webassemblyjs/ast@1.5.9":
@@ -398,8 +444,8 @@ async@^2.5.0, async@^2.6.0:
     lodash "^4.17.10"
 
 atob@^2.1.1:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.1.tgz#ae2d5a729477f289d60dd7f96a6314a22dd6c22a"
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9"
 
 autoprefixer@^6.3.1:
   version "6.7.7"
@@ -413,16 +459,17 @@ autoprefixer@^6.3.1:
     postcss-value-parser "^3.2.3"
 
 awesome-typescript-loader@^5.0.0:
-  version "5.0.0"
-  resolved "https://registry.yarnpkg.com/awesome-typescript-loader/-/awesome-typescript-loader-5.0.0.tgz#130c304ae52a60933f15d93f7629003b483fa8b1"
+  version "5.2.1"
+  resolved "https://registry.yarnpkg.com/awesome-typescript-loader/-/awesome-typescript-loader-5.2.1.tgz#a41daf7847515f4925cdbaa3075d61f289e913fc"
   dependencies:
-    chalk "^2.3.1"
+    chalk "^2.4.1"
     enhanced-resolve "^4.0.0"
     loader-utils "^1.1.0"
     lodash "^4.17.5"
     micromatch "^3.1.9"
     mkdirp "^0.5.1"
     source-map-support "^0.5.3"
+    webpack-log "^1.2.0"
 
 axios@^0.18.0:
   version "0.18.0"
@@ -622,6 +669,15 @@ babel-plugin-check-es2015-constants@^6.22.0:
   dependencies:
     babel-runtime "^6.22.0"
 
+"babel-plugin-styled-components@>= 1":
+  version "1.10.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-1.10.0.tgz#ff1f42ad2cc78c21f26b62266b8f564dbc862939"
+  dependencies:
+    "@babel/helper-annotate-as-pure" "^7.0.0"
+    "@babel/helper-module-imports" "^7.0.0"
+    babel-plugin-syntax-jsx "^6.18.0"
+    lodash "^4.17.10"
+
 babel-plugin-syntax-async-functions@^6.8.0:
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95"
@@ -658,7 +714,7 @@ babel-plugin-syntax-flow@^6.18.0:
   version "6.18.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-flow/-/babel-plugin-syntax-flow-6.18.0.tgz#4c3ab20a2af26aa20cd25995c398c4eb70310c8d"
 
-babel-plugin-syntax-jsx@^6.3.13, babel-plugin-syntax-jsx@^6.8.0:
+babel-plugin-syntax-jsx@^6.18.0, babel-plugin-syntax-jsx@^6.3.13, babel-plugin-syntax-jsx@^6.8.0:
   version "6.18.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
 
@@ -1124,6 +1180,10 @@ big.js@^3.1.3:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/big.js/-/big.js-3.2.0.tgz#a5fc298b81b9e0dca2e458824784b65c52ba588e"
 
+big.js@^5.2.2:
+  version "5.2.2"
+  resolved "https://registry.yarnpkg.com/big.js/-/big.js-5.2.2.tgz#65f0af382f578bcdc742bd9c281e9cb2d7768328"
+
 binary-extensions@^1.0.0:
   version "1.11.0"
   resolved "https://registry.yarnpkg.com/binary-extensions/-/binary-extensions-1.11.0.tgz#46aa1751fb6a2f93ee5e689bb1087d4b14c6c205"
@@ -1260,8 +1320,8 @@ browserslist@^1.3.6, browserslist@^1.5.2, browserslist@^1.7.6:
     electron-to-chromium "^1.2.7"
 
 buffer-from@^1.0.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.0.tgz#87fcaa3a298358e0ade6e442cfce840740d1ad04"
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.1.tgz#32713bc028f75c02fdb710d7c7bcec1f2c6070ef"
 
 buffer-indexof@^1.0.0:
   version "1.1.1"
@@ -1279,13 +1339,6 @@ buffer@^4.3.0:
     ieee754 "^1.1.4"
     isarray "^1.0.0"
 
-buffer@^5.0.3:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/buffer/-/buffer-5.1.0.tgz#c913e43678c7cb7c8bd16afbcddb6c5505e8f9fe"
-  dependencies:
-    base64-js "^1.0.2"
-    ieee754 "^1.1.4"
-
 builtin-modules@^1.0.0, builtin-modules@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-1.1.1.tgz#270f076c5a72c02f5b65a47df94c5fe3a278892f"
@@ -1373,7 +1426,7 @@ chalk@^1.0.0, chalk@^1.1.1, chalk@^1.1.3:
     strip-ansi "^3.0.0"
     supports-color "^2.0.0"
 
-chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.0, chalk@^2.3.1, chalk@^2.4.1:
+chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.4.1:
   version "2.4.1"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.1.tgz#18c49ab16a037b6eb0152cc83e3471338215b66e"
   dependencies:
@@ -1381,6 +1434,14 @@ chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.0, chalk@^2.3.1, chalk@^2.4
     escape-string-regexp "^1.0.5"
     supports-color "^5.3.0"
 
+chalk@^2.3.0:
+  version "2.4.2"
+  resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424"
+  dependencies:
+    ansi-styles "^3.2.1"
+    escape-string-regexp "^1.0.5"
+    supports-color "^5.3.0"
+
 chalk@~0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-0.4.0.tgz#5199a3ddcd0c1efe23bc08c1b027b06176e0c64f"
@@ -1562,16 +1623,26 @@ collection-visit@^1.0.0:
     map-visit "^1.0.0"
     object-visit "^1.0.0"
 
-color-convert@^1.3.0, color-convert@^1.9.0:
+color-convert@^1.3.0:
   version "1.9.1"
   resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.1.tgz#c1261107aeb2f294ebffec9ed9ecad529a6097ed"
   dependencies:
     color-name "^1.1.1"
 
-color-name@^1.0.0, color-name@^1.1.1:
+color-convert@^1.9.0:
+  version "1.9.3"
+  resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8"
+  dependencies:
+    color-name "1.1.3"
+
+color-name@1.1.3, color-name@^1.0.0:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25"
 
+color-name@^1.1.1:
+  version "1.1.4"
+  resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
+
 color-string@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/color-string/-/color-string-0.3.0.tgz#27d46fb67025c5c2fa25993bfbf579e47841b991"
@@ -1815,9 +1886,9 @@ css-selector-tokenizer@^0.7.0:
     fastparse "^1.1.1"
     regexpu-core "^1.0.0"
 
-css-to-react-native@^2.0.3:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/css-to-react-native/-/css-to-react-native-2.2.0.tgz#d524ef7f39a2747a8914e86563669ba35b7cf2e7"
+css-to-react-native@^2.2.2:
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/css-to-react-native/-/css-to-react-native-2.2.2.tgz#c077d0f7bf3e6c915a539e7325821c9dd01f9965"
   dependencies:
     css-color-keywords "^1.0.0"
     fbjs "^0.8.5"
@@ -1872,13 +1943,19 @@ csso@~2.3.1:
     source-map "^0.5.3"
 
 csstype@^2.2.0:
-  version "2.5.3"
-  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.5.3.tgz#2504152e6e1cc59b32098b7f5d6a63f16294c1f7"
+  version "2.6.1"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.1.tgz#4cfbf637a577497036ebcd7e32647ef19a0b8076"
 
 cyclist@~0.2.2:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/cyclist/-/cyclist-0.2.2.tgz#1b33792e11e914a2fd6d6ed6447464444e5fa640"
 
+d@1:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/d/-/d-1.0.0.tgz#754bb5bfe55451da69a58b94d45f4c5b0462d58f"
+  dependencies:
+    es5-ext "^0.10.9"
+
 dargs@^5.1.0:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/dargs/-/dargs-5.1.0.tgz#ec7ea50c78564cd36c9d5ec18f66329fade27829"
@@ -1952,6 +2029,12 @@ default-gateway@^2.6.0:
     execa "^0.10.0"
     ip-regex "^2.1.0"
 
+define-properties@^1.1.2:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/define-properties/-/define-properties-1.1.3.tgz#cf88da6cbee26fe6db7094f61d870cbd84cee9f1"
+  dependencies:
+    object-keys "^1.0.12"
+
 define-property@^0.2.5:
   version "0.2.5"
   resolved "https://registry.yarnpkg.com/define-property/-/define-property-0.2.5.tgz#c35b1ef918ec3c990f9a5bc57be04aacec5c8116"
@@ -2129,8 +2212,8 @@ end-of-stream@^1.0.0, end-of-stream@^1.1.0:
     once "^1.4.0"
 
 enhanced-resolve@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-4.0.0.tgz#e34a6eaa790f62fccd71d93959f56b2b432db10a"
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/enhanced-resolve/-/enhanced-resolve-4.1.0.tgz#41c7e0bfdfe74ac1ffe1e57ad6a5c6c9f3742a7f"
   dependencies:
     graceful-fs "^4.1.2"
     memory-fs "^0.4.0"
@@ -2163,6 +2246,29 @@ error@^7.0.2:
     string-template "~0.2.1"
     xtend "~4.0.0"
 
+es5-ext@^0.10.35, es5-ext@^0.10.9, es5-ext@~0.10.14:
+  version "0.10.47"
+  resolved "https://registry.yarnpkg.com/es5-ext/-/es5-ext-0.10.47.tgz#d24232e1380daad5449a817be19bde9729024a11"
+  dependencies:
+    es6-iterator "~2.0.3"
+    es6-symbol "~3.1.1"
+    next-tick "1"
+
+es6-iterator@~2.0.3:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/es6-iterator/-/es6-iterator-2.0.3.tgz#a7de889141a05a94b0854403b2d0a0fbfa98f3b7"
+  dependencies:
+    d "1"
+    es5-ext "^0.10.35"
+    es6-symbol "^3.1.1"
+
+es6-symbol@^3.1.1, es6-symbol@~3.1.1:
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/es6-symbol/-/es6-symbol-3.1.1.tgz#bf00ef4fdab6ba1b46ecb7b629b4c7ed5715cc77"
+  dependencies:
+    d "1"
+    es5-ext "~0.10.14"
+
 escape-html@~1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/escape-html/-/escape-html-1.0.3.tgz#0258eae4d3d0c0974de1c169188ef0051d1d1988"
@@ -2412,7 +2518,19 @@ faye-websocket@~0.11.1:
   dependencies:
     websocket-driver ">=0.5.1"
 
-fbjs@^0.8.16, fbjs@^0.8.5:
+fbjs@^0.8.16:
+  version "0.8.17"
+  resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd"
+  dependencies:
+    core-js "^1.0.0"
+    isomorphic-fetch "^2.1.1"
+    loose-envify "^1.0.0"
+    object-assign "^4.1.0"
+    promise "^7.1.1"
+    setimmediate "^1.0.5"
+    ua-parser-js "^0.7.18"
+
+fbjs@^0.8.5:
   version "0.8.16"
   resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.16.tgz#5e67432f550dc41b572bf55847b8aca64e5337db"
   dependencies:
@@ -2777,11 +2895,11 @@ got@^8.3.1:
     url-parse-lax "^3.0.0"
     url-to-options "^1.0.1"
 
-graceful-fs@^4.1.11, graceful-fs@^4.1.2:
+graceful-fs@^4.1.11:
   version "4.1.11"
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.11.tgz#0e8bdfe4d1ddb8854d64e04ea7c00e2a026e5658"
 
-graceful-fs@^4.1.6:
+graceful-fs@^4.1.2, graceful-fs@^4.1.6:
   version "4.1.15"
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.15.tgz#ffb703e1066e8a0eeaa4c8b80ba9253eeefbfb00"
 
@@ -2817,6 +2935,10 @@ has-symbol-support-x@^1.4.1:
   version "1.4.2"
   resolved "https://registry.yarnpkg.com/has-symbol-support-x/-/has-symbol-support-x-1.4.2.tgz#1409f98bc00247da45da67cee0a36f282ff26455"
 
+has-symbols@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.0.tgz#ba1a8f1af2a0fc39650f5c850367704122063b44"
+
 has-to-string-tag-x@^1.2.0:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/has-to-string-tag-x/-/has-to-string-tag-x-1.4.1.tgz#a045ab383d7b4b2012a00148ab0aa5f290044d4d"
@@ -2972,12 +3094,18 @@ https-browserify@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/https-browserify/-/https-browserify-1.0.0.tgz#ec06c10e0a34c0f2faf199f7fd7fc78fffd03c73"
 
-iconv-lite@0.4.23, iconv-lite@^0.4.17, iconv-lite@^0.4.4, iconv-lite@~0.4.13:
+iconv-lite@0.4.23, iconv-lite@^0.4.17, iconv-lite@^0.4.4:
   version "0.4.23"
   resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.23.tgz#297871f63be507adcfbfca715d0cd0eed84e9a63"
   dependencies:
     safer-buffer ">= 2.1.2 < 3"
 
+iconv-lite@~0.4.13:
+  version "0.4.24"
+  resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"
+  dependencies:
+    safer-buffer ">= 2.1.2 < 3"
+
 icss-replace-symbols@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz#06ea6f83679a7749e386cfe1fe812ae5db223ded"
@@ -3279,12 +3407,6 @@ is-observable@^1.1.0:
   dependencies:
     symbol-observable "^1.1.0"
 
-is-odd@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/is-odd/-/is-odd-2.0.0.tgz#7646624671fd7ea558ccd9a2795182f2958f1b24"
-  dependencies:
-    is-number "^4.0.0"
-
 is-path-cwd@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-path-cwd/-/is-path-cwd-1.0.0.tgz#d225ec23132e89edd38fda767472e62e65f1106d"
@@ -3415,9 +3537,13 @@ js-tokens@^3.0.0, js-tokens@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
 
+"js-tokens@^3.0.0 || ^4.0.0":
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
+
 js-yaml@^3.7.0:
-  version "3.12.0"
-  resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.12.0.tgz#eaed656ec8344f10f527c6bfa1b6e2244de167d1"
+  version "3.12.1"
+  resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.12.1.tgz#295c8632a18a23e054cf5c9d3cecafe678167600"
   dependencies:
     argparse "^1.0.7"
     esprima "^4.0.0"
@@ -3503,6 +3629,12 @@ json5@^0.5.0, json5@^0.5.1:
   version "0.5.1"
   resolved "https://registry.yarnpkg.com/json5/-/json5-0.5.1.tgz#1eade7acc012034ad84e2396767ead9fa5495821"
 
+json5@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/json5/-/json5-1.0.1.tgz#779fb0018604fa854eacbf6252180d83543e3dbe"
+  dependencies:
+    minimist "^1.2.0"
+
 jsonfile@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-4.0.0.tgz#8771aae0799b64076b76640fca058f9c10e33ecb"
@@ -3619,7 +3751,7 @@ loader-runner@^2.3.0:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-2.3.0.tgz#f482aea82d543e07921700d5a46ef26fdac6b8a2"
 
-loader-utils@^1.0.2, loader-utils@^1.1.0:
+loader-utils@^1.0.2:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.1.0.tgz#c98aef488bcceda2ffb5e2de646d6a754429f5cd"
   dependencies:
@@ -3627,6 +3759,14 @@ loader-utils@^1.0.2, loader-utils@^1.1.0:
     emojis-list "^2.0.0"
     json5 "^0.5.0"
 
+loader-utils@^1.1.0:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.2.3.tgz#1ff5dc6911c9f0a062531a4c04b609406108c2c7"
+  dependencies:
+    big.js "^5.2.2"
+    emojis-list "^2.0.0"
+    json5 "^1.0.1"
+
 loader-utils@~0.2.2:
   version "0.2.17"
   resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-0.2.17.tgz#f86e6374d43205a6e6c60e9196f17c0299bfb348"
@@ -3666,11 +3806,11 @@ lodash.uniq@^4.5.0:
   version "4.5.0"
   resolved "https://registry.yarnpkg.com/lodash.uniq/-/lodash.uniq-4.5.0.tgz#d0225373aeb652adc1bc82e4945339a842754773"
 
-"lodash@>=3.5 <5":
+"lodash@>=3.5 <5", lodash@^4.17.5:
   version "4.17.11"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"
 
-lodash@^4.13.1, lodash@^4.17.10, lodash@^4.17.2, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.3.0:
+lodash@^4.13.1, lodash@^4.17.10, lodash@^4.17.2, lodash@^4.17.4, lodash@^4.3.0:
   version "4.17.10"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.10.tgz#1b7793cf7259ea38fb3661d4d38b3260af8ae4e7"
 
@@ -3697,11 +3837,24 @@ loglevel@^1.4.1:
   version "1.6.1"
   resolved "https://registry.yarnpkg.com/loglevel/-/loglevel-1.6.1.tgz#e0fc95133b6ef276cdc8887cdaf24aa6f156f8fa"
 
+loglevelnext@^1.0.1:
+  version "1.0.5"
+  resolved "https://registry.yarnpkg.com/loglevelnext/-/loglevelnext-1.0.5.tgz#36fc4f5996d6640f539ff203ba819641680d75a2"
+  dependencies:
+    es6-symbol "^3.1.1"
+    object.assign "^4.1.0"
+
 long@^3.2.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/long/-/long-3.2.0.tgz#d821b7138ca1cb581c172990ef14db200b5c474b"
 
-loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.2.0, loose-envify@^1.3.1:
+loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.3.1:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
+  dependencies:
+    js-tokens "^3.0.0 || ^4.0.0"
+
+loose-envify@^1.2.0:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.3.1.tgz#d1a8ad33fa9ce0e713d65fdd0ac8b748d478c848"
   dependencies:
@@ -3805,6 +3958,10 @@ mem@^4.0.0:
     mimic-fn "^1.0.0"
     p-is-promise "^1.1.0"
 
+memoize-one@^4.0.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-4.1.0.tgz#a2387c58c03fff27ca390c31b764a79addf3f906"
+
 memory-fs@^0.4.0, memory-fs@~0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/memory-fs/-/memory-fs-0.4.1.tgz#3a9a20b8462523e447cfbc7e8bb80ed667bfc552"
@@ -4023,15 +4180,14 @@ nan@^2.9.2:
   resolved "https://registry.yarnpkg.com/nan/-/nan-2.10.0.tgz#96d0cd610ebd58d4b4de9cc0c6828cda99c7548f"
 
 nanomatch@^1.2.9:
-  version "1.2.9"
-  resolved "https://registry.yarnpkg.com/nanomatch/-/nanomatch-1.2.9.tgz#879f7150cb2dab7a471259066c104eee6e0fa7c2"
+  version "1.2.13"
+  resolved "https://registry.yarnpkg.com/nanomatch/-/nanomatch-1.2.13.tgz#b87a8aa4fc0de8fe6be88895b38983ff265bd119"
   dependencies:
     arr-diff "^4.0.0"
     array-unique "^0.3.2"
     define-property "^2.0.2"
     extend-shallow "^3.0.2"
     fragment-cache "^0.2.1"
-    is-odd "^2.0.0"
     is-windows "^1.0.2"
     kind-of "^6.0.2"
     object.pick "^1.3.0"
@@ -4055,6 +4211,10 @@ neo-async@^2.5.0:
   version "2.5.1"
   resolved "https://registry.yarnpkg.com/neo-async/-/neo-async-2.5.1.tgz#acb909e327b1e87ec9ef15f41b8a269512ad41ee"
 
+next-tick@1:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/next-tick/-/next-tick-1.0.0.tgz#ca86d1fe8828169b0120208e3dc8424b9db8342c"
+
 nice-try@^1.0.4:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/nice-try/-/nice-try-1.0.4.tgz#d93962f6c52f2c1558c0fbda6d512819f1efe1c4"
@@ -4217,12 +4377,25 @@ object-copy@^0.1.0:
     define-property "^0.2.5"
     kind-of "^3.0.3"
 
+object-keys@^1.0.11, object-keys@^1.0.12:
+  version "1.0.12"
+  resolved "https://registry.yarnpkg.com/object-keys/-/object-keys-1.0.12.tgz#09c53855377575310cca62f55bb334abff7b3ed2"
+
 object-visit@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/object-visit/-/object-visit-1.0.1.tgz#f79c4493af0c5377b59fe39d395e41042dd045bb"
   dependencies:
     isobject "^3.0.0"
 
+object.assign@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/object.assign/-/object.assign-4.1.0.tgz#968bf1100d7956bb3ca086f006f846b3bc4008da"
+  dependencies:
+    define-properties "^1.1.2"
+    function-bind "^1.1.1"
+    has-symbols "^1.0.0"
+    object-keys "^1.0.11"
+
 object.omit@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/object.omit/-/object.omit-2.0.1.tgz#1a9c744829f39dbb858c76ca3579ae2a54ebd1fa"
@@ -4478,9 +4651,9 @@ path-key@^2.0.0, path-key@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/path-key/-/path-key-2.0.1.tgz#411cadb574c5a140d3a4b1910d40d80cc9f40b40"
 
-path-parse@^1.0.5:
-  version "1.0.5"
-  resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.5.tgz#3c1adf871ea9cd6c9431b6ea2bd74a0ff055c4c1"
+path-parse@^1.0.5, path-parse@^1.0.6:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.6.tgz#d62dbb5679405d72c4737ec58600e9ddcf06d24c"
 
 path-to-regexp@0.1.7:
   version "0.1.7"
@@ -4841,14 +5014,14 @@ promise@^7.1.1:
   dependencies:
     asap "~2.0.3"
 
-prop-types@^15.3.0:
+prop-types@^15.3.0, prop-types@^15.6.2:
   version "15.6.2"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.2.tgz#05d5ca77b4453e985d60fc7ff8c859094a497102"
   dependencies:
     loose-envify "^1.3.1"
     object-assign "^4.1.1"
 
-prop-types@^15.5.4, prop-types@^15.6.0, prop-types@^15.6.1:
+prop-types@^15.5.4, prop-types@^15.6.1:
   version "15.6.1"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.1.tgz#36644453564255ddda391191fb3a125cbdf654ca"
   dependencies:
@@ -4987,17 +5160,17 @@ rc@^1.1.7:
     strip-json-comments "~2.0.1"
 
 react-dom@^16.4.0:
-  version "16.4.0"
-  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.4.0.tgz#099f067dd5827ce36a29eaf9a6cdc7cbf6216b1e"
+  version "16.7.0"
+  resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-16.7.0.tgz#a17b2a7ca89ee7390bc1ed5eb81783c7461748b8"
   dependencies:
-    fbjs "^0.8.16"
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
-    prop-types "^15.6.0"
+    prop-types "^15.6.2"
+    scheduler "^0.12.0"
 
-react-is@^16.3.1:
-  version "16.4.0"
-  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.4.0.tgz#cc9fdc855ac34d2e7d9d2eb7059bbc240d35ffcf"
+react-is@^16.6.0:
+  version "16.7.0"
+  resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.7.0.tgz#c1bd21c64f1f1364c6f70695ec02d69392f41bfa"
 
 react-lifecycles-compat@^3.0.2:
   version "3.0.4"
@@ -5026,9 +5199,9 @@ react-router@^4.3.1:
     prop-types "^15.6.1"
     warning "^4.0.1"
 
-react-slick@^0.23.1:
-  version "0.23.1"
-  resolved "https://registry.yarnpkg.com/react-slick/-/react-slick-0.23.1.tgz#15791c4107f0ba3a5688d5bd97b7b7ceaa0dd181"
+react-slick@^0.24.0:
+  version "0.24.0"
+  resolved "https://registry.yarnpkg.com/react-slick/-/react-slick-0.24.0.tgz#1a4e078a82de4e9458255d9ce26aa6f3b17b168b"
   dependencies:
     classnames "^2.2.5"
     enquire.js "^2.1.6"
@@ -5046,13 +5219,13 @@ react-twitter-widgets@^1.7.1:
     scriptjs "^2.5.8"
 
 react@^16.4.0:
-  version "16.4.0"
-  resolved "https://registry.yarnpkg.com/react/-/react-16.4.0.tgz#402c2db83335336fba1962c08b98c6272617d585"
+  version "16.7.0"
+  resolved "https://registry.yarnpkg.com/react/-/react-16.7.0.tgz#b674ec396b0a5715873b350446f7ea0802ab6381"
   dependencies:
-    fbjs "^0.8.16"
     loose-envify "^1.1.0"
     object-assign "^4.1.1"
-    prop-types "^15.6.0"
+    prop-types "^15.6.2"
+    scheduler "^0.12.0"
 
 read-chunk@^2.1.0:
   version "2.1.0"
@@ -5200,8 +5373,8 @@ remove-trailing-separator@^1.0.1:
   resolved "https://registry.yarnpkg.com/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz#c24bce2a283adad5bc3f58e0d48249b92379d8ef"
 
 repeat-element@^1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/repeat-element/-/repeat-element-1.1.2.tgz#ef089a178d1483baae4d93eb98b4f9e4e11d990a"
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/repeat-element/-/repeat-element-1.1.3.tgz#782e0d825c0c5a3bb39731f84efee6b742e6b1ce"
 
 repeat-string@^1.5.2, repeat-string@^1.6.1:
   version "1.6.1"
@@ -5269,10 +5442,10 @@ resolve@^1.1.6:
     path-parse "^1.0.5"
 
 resolve@^1.3.2:
-  version "1.8.1"
-  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.8.1.tgz#82f1ec19a423ac1fbd080b0bab06ba36e84a7a26"
+  version "1.10.0"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.10.0.tgz#3bdaaeaf45cc07f375656dfd2e54ed0810b101ba"
   dependencies:
-    path-parse "^1.0.5"
+    path-parse "^1.0.6"
 
 responselike@1.0.2:
   version "1.0.2"
@@ -5357,6 +5530,13 @@ sax@^1.2.4, sax@~1.2.1:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
 
+scheduler@^0.12.0:
+  version "0.12.0"
+  resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.12.0.tgz#8ab17699939c0aedc5a196a657743c496538647b"
+  dependencies:
+    loose-envify "^1.1.0"
+    object-assign "^4.1.1"
+
 schema-utils@^0.4.3, schema-utils@^0.4.4, schema-utils@^0.4.5:
   version "0.4.5"
   resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-0.4.5.tgz#21836f0608aac17b78f9e3e24daff14a5ca13a3e"
@@ -5390,10 +5570,14 @@ selfsigned@^1.9.1:
   dependencies:
     node-forge "0.7.5"
 
-"semver@2 || 3 || 4 || 5", semver@^5.3.0, semver@^5.5.0:
+"semver@2 || 3 || 4 || 5", semver@^5.5.0:
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.5.0.tgz#dc4bbc7a6ca9d916dee5d43516f0092b58f7b8ab"
 
+semver@^5.3.0:
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-5.6.0.tgz#7e74256fbaa49c75aa7c7a205cc22799cac80004"
+
 send@0.16.2:
   version "0.16.2"
   resolved "https://registry.yarnpkg.com/send/-/send-0.16.2.tgz#6ecca1e0f8c156d141597559848df64730a6bbc1"
@@ -5602,8 +5786,8 @@ source-map-support@^0.4.15:
     source-map "^0.5.6"
 
 source-map-support@^0.5.3:
-  version "0.5.6"
-  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.6.tgz#4435cee46b1aab62b8e8610ce60f788091c51c13"
+  version "0.5.10"
+  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.10.tgz#2214080bc9d51832511ee2bab96e3c2f9353120c"
   dependencies:
     buffer-from "^1.0.0"
     source-map "^0.6.0"
@@ -5805,20 +5989,21 @@ style-loader@^0.21.0:
     loader-utils "^1.1.0"
     schema-utils "^0.4.5"
 
-styled-components@^3.3.2:
-  version "3.3.2"
-  resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-3.3.2.tgz#087b96830ee3d60d9a8b5ef17c132b4f29cc71df"
-  dependencies:
-    buffer "^5.0.3"
-    css-to-react-native "^2.0.3"
-    fbjs "^0.8.16"
-    hoist-non-react-statics "^2.5.0"
-    is-plain-object "^2.0.1"
+styled-components@^4.1.3:
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-4.1.3.tgz#4472447208e618b57e84deaaeb6acd34a5e0fe9b"
+  dependencies:
+    "@babel/helper-module-imports" "^7.0.0"
+    "@emotion/is-prop-valid" "^0.7.3"
+    "@emotion/unitless" "^0.7.0"
+    babel-plugin-styled-components ">= 1"
+    css-to-react-native "^2.2.2"
+    memoize-one "^4.0.0"
     prop-types "^15.5.4"
-    react-is "^16.3.1"
+    react-is "^16.6.0"
     stylis "^3.5.0"
     stylis-rule-sheet "^0.0.10"
-    supports-color "^3.2.3"
+    supports-color "^5.5.0"
 
 stylis-rule-sheet@^0.0.10:
   version "0.0.10"
@@ -5838,13 +6023,13 @@ supports-color@^3.2.3:
   dependencies:
     has-flag "^1.0.0"
 
-supports-color@^5.1.0:
+supports-color@^5.1.0, supports-color@^5.3.0, supports-color@^5.5.0:
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
   dependencies:
     has-flag "^3.0.0"
 
-supports-color@^5.3.0, supports-color@^5.4.0:
+supports-color@^5.4.0:
   version "5.4.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.4.0.tgz#1c6b337402c2137605efe19f10fec390f6faab54"
   dependencies:
@@ -5871,8 +6056,8 @@ symbol-observable@^1.1.0:
   resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.2.0.tgz#c22688aed4eab3cdc2dfeacbb561660560a00804"
 
 tapable@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/tapable/-/tapable-1.0.0.tgz#cbb639d9002eed9c6b5975eb20598d7936f1f9f2"
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/tapable/-/tapable-1.1.1.tgz#4d297923c5a72a42360de2ab52dadfaaec00018e"
 
 tar@^4:
   version "4.4.4"
@@ -5940,6 +6125,10 @@ to-fast-properties@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-1.0.3.tgz#b83571fa4d8c25b82e231b06e3a3055de4ca1a47"
 
+to-fast-properties@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e"
+
 to-object-path@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/to-object-path/-/to-object-path-0.3.0.tgz#297588b7b0e7e0ac08e04e672f85c1f4999e17af"
@@ -5987,8 +6176,8 @@ tslint-plugin-prettier@^2.0.1:
     tslib "^1.7.1"
 
 tslint@^5.11.0:
-  version "5.11.0"
-  resolved "https://registry.yarnpkg.com/tslint/-/tslint-5.11.0.tgz#98f30c02eae3cde7006201e4c33cb08b48581eed"
+  version "5.12.1"
+  resolved "https://registry.yarnpkg.com/tslint/-/tslint-5.12.1.tgz#8cec9d454cf8a1de9b0a26d7bdbad6de362e52c1"
   dependencies:
     babel-code-frame "^6.22.0"
     builtin-modules "^1.1.1"
@@ -6024,13 +6213,13 @@ typedarray@^0.0.6:
   version "0.0.6"
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
 
-typescript@^2.9.1:
-  version "2.9.1"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-2.9.1.tgz#fdb19d2c67a15d11995fd15640e373e09ab09961"
+typescript@^3.4.5:
+  version "3.4.5"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.4.5.tgz#2d2618d10bb566572b8d7aad5180d84257d70a99"
 
-ua-parser-js@^0.7.9:
-  version "0.7.18"
-  resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.18.tgz#a7bfd92f56edfb117083b69e31d2aa8882d4b1ed"
+ua-parser-js@^0.7.18, ua-parser-js@^0.7.9:
+  version "0.7.19"
+  resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.19.tgz#94151be4c0a7fb1d001af7022fdaca4642659e4b"
 
 uglify-es@^3.3.4:
   version "3.3.10"
@@ -6157,10 +6346,8 @@ url@^0.11.0:
     querystring "0.2.0"
 
 use@^3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/use/-/use-3.1.0.tgz#14716bf03fdfefd03040aef58d8b4b85f3a7c544"
-  dependencies:
-    kind-of "^6.0.2"
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/use/-/use-3.1.1.tgz#d50c8cac79a19fbc20f2911f56eb973f4e10070f"
 
 util-deprecate@~1.0.1:
   version "1.0.2"
@@ -6176,7 +6363,7 @@ utils-merge@1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/utils-merge/-/utils-merge-1.0.1.tgz#9f95710f50a267947b2ccc124741c1028427e713"
 
-uuid@^3.0.1, uuid@^3.3.2:
+uuid@^3.0.1, uuid@^3.1.0, uuid@^3.3.2:
   version "3.3.2"
   resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.3.2.tgz#1b4af4955eb3077c501c23872fc6513811587131"
 
@@ -6344,6 +6531,15 @@ webpack-dev-server@^3.1.10:
     webpack-log "^2.0.0"
     yargs "12.0.2"
 
+webpack-log@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/webpack-log/-/webpack-log-1.2.0.tgz#a4b34cda6b22b518dbb0ab32e567962d5c72a43d"
+  dependencies:
+    chalk "^2.1.0"
+    log-symbols "^2.1.0"
+    loglevelnext "^1.0.1"
+    uuid "^3.1.0"
+
 webpack-log@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/webpack-log/-/webpack-log-2.0.0.tgz#5b7928e0637593f119d32f6227c1e0ac31e1b47f"
@@ -6413,8 +6609,8 @@ websocket-extensions@>=0.1.1:
   resolved "https://registry.yarnpkg.com/websocket-extensions/-/websocket-extensions-0.1.3.tgz#5d2ff22977003ec687a4b87073dfbbac146ccf29"
 
 whatwg-fetch@>=0.10.0:
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-2.0.4.tgz#dde6a5df315f9d39991aa17621853d720b85566f"
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.0.0.tgz#fc804e458cc460009b1a2b966bc8817d2578aefb"
 
 whet.extend@~0.9.9:
   version "0.9.9"