.

backend/public/mix-manifest.json

@@ -1,4 +1,4 @@
 {
     "/js/app.js": "/js/app.js",
-    "/css/index.css": "/css/index.css"
+    "/css/app.css": "/css/app.css"
 }

backend/resources/js/pages/contacts/complete.js

@@ -1,17 +1,29 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
+import { Button } from '@material-ui/core';
+
 
 const Contact_Complete = () => {
 	return (
-        <>
-            <h1>本登録</h1>
-            <form name="login" action="/login" accept-charset="UTF-8" method="post">
-                <div class="edit-set-bg u-mb30-lose u-mb25-gain">
-                {/* <p>退会完了しました。<br>今後とも、危機管理をよろしくお願いいたします。</p> */}
+        <div>
+            <h4>お問い合わせ完了</h4>
+            <p>
+                お問い合わせが完了しました。
+                3営業日以内にお返事させていただきます。<br/>
+                万が一届かない場合は、以下のメールアドレスに 直接ご連絡くださいませ。
+            </p>
+            <div>
+                sample@gmail.com
+            </div>
+            <div className="row">
+                <div class="col-6">
+                    <Button fullWidth>親ログイン画面へ</Button>
                 </div>
-                <a href="" class="login-submit btn-default btn-r14 btn-h70 btn-yellow">ログイン画面へ</a>
-            </form>
-        </>
+                <div className="col-6">
+                    <Button fullWidth>子ログイン画面へ</Button>
+                </div>
+            </div>
+        </div>
 	)
 }
 

backend/resources/sass/app.scss

@@ -1,35 +1,58 @@
 @charset "UTF-8";
 
-$breakpoint-up: (
-    'sm': 'screen and (min-width: 600px)',
-    'md': 'screen and (min-width: 900px)',
-) !default;
-
-$breakpoint-down: (
-    'sm': 'screen and (max-width: 599px)',
-    'md': 'screen and (max-width: 899px)',
-) !default;
-
-@mixin mq_up($breakpoint: md) {
-    @media #{map-get($breakpoint-up, $breakpoint)} {
+@mixin pc($breakpoint: $_default-breakpoint) {
+    @if map-has-key($_breakpoint-up, $breakpoint) {
+      @media screen and (min-width: 1068px) {
         @content;
+      }
+    } @else {
+      @warn "Unfortunately, no value could be retrieved from `#{$breakpoint}`. "
+      + "Please make sure it is defined in `$_breakpoint-up` map.";
     }
-}
+  }
 
-@mixin mq_down($breakpoint: md) {
-    @media #{map-get($breakpoint-down, $breakpoint)} {
+@mixin sp($breakpoint: $_default-breakpoint) {
+    @if map-has-key($_breakpoint-down, $breakpoint) {
+      @media screen and (max-width: 1067px) {
         @content;
+      }
+    } @else {
+      @warn "Unfortunately, no value could be retrieved from `#{$breakpoint}`. "
+      + "Please make sure it is defined in `$_breakpoint-down` map.";
     }
-}
+  }
+  
+  @mixin sp02($breakpoint: $_default-breakpoint) {
+    @if map-has-key($_breakpoint-down, $breakpoint) {
+      @media screen and (max-width: 430px) {
+        @content;
+      }
+    } @else {
+      @warn "Unfortunately, no value could be retrieved from `#{$breakpoint}`. "
+      + "Please make sure it is defined in `$_breakpoint-down` map.";
+    }
+  }
+  
+  
+  @mixin min($breakpoint: $_default-breakpoint) {
+    @if map-has-key($_breakpoint-down, $breakpoint) {
+      @media screen and (max-width: 374px) {
+        @content;
+      }
+    } @else {
+      @warn "Unfortunately, no value could be retrieved from `#{$breakpoint}`. "
+      + "Please make sure it is defined in `$_breakpoint-down` map.";
+    }
+  }
+  
+
 
 /* Fonts */
 @import url('https://fonts.googleapis.com/css?family=Nunito');
 
-/* Variables */
-@import 'variables';
 
 // Bootstrap
-// @import '~bootstrap/scss/bootstrap';
+@import '~bootstrap/scss/bootstrap';
 
 
 /* ---------------------------------------------------------------------------------
@@ -56,12 +79,7 @@ $inputBorderGray: #D8D8D8;
 /* ---------------------------------------------------------------------------------
 	layout
     --------------------------------------------------------------------------------- */
-@import "./variables";
+// @import "./variables";
 
-@import "./layout/_footer";
-@import "./layout/_header";
-@import "./layout/_main";
-@import "./layout/_section";
-@import "./layout/_content";
-@import "./layout/_side";
+// @import "./layout/_main";
 

backend/webpack.mix.js

@@ -13,4 +13,4 @@ const mix = require('laravel-mix');
 
  mix.js('resources/js/app.js', 'public/js')
     .react()
-    .sass('resources/sass/index.scss', 'public/css');
+    .sass('resources/sass/app.scss', 'public/css');