init

2025-03-05 14:02:29 +09:00
commit 247a7808d3
357 changed files with 161196 additions and 0 deletions
@@ -0,0 +1,128 @@
+
+@mixin chk_input { //chckbox input style
+    width:1px; 
+    height:1px; 
+    position:absolute; 
+    right:0; 
+    text-indent: -999px;
+    &:checked + label{
+        border-color: rgb(var(--bs-red-origin));
+    }
+    &:checked + label i.bi-check2::before {
+        content:"\f26f";
+        color:rgb(var(--bs-red-origin));
+    }
+}
+
+@mixin chk_label($wd:20px,$h:20px){//chckbox label style
+    width:$wd; 
+    height:$h; 
+    border-radius:50%; 
+    border:1px solid rgb(var(--bs-black)); 
+    position:relative; 
+    cursor:pointer;
+    &:hover{
+        animation:flash 2s infinite;
+    }
+    i{
+        display: block;  
+        line-height: 1.2; 
+        height: 100%;
+    }
+}
+
+.agree-container{
+    margin:0 auto;   
+    .card{
+        max-width: 500px;
+        margin:0 auto; 
+        --bs-card-border-color:transparent; 
+        --bs-card-bg:inherit; 
+    }
+    .card-title{
+        font-size:1.5rem; 
+        margin:2.5rem 0;
+    }
+    .card-body{
+        padding:0;
+    }
+    button:has(input[name="chk_all"]){
+        width:100%; 
+        height:4.375rem; 
+        position:relative; 
+        padding:5px; 
+        margin-bottom:3.12rem;  
+        background-color:rgb(var(--bs-gray-softPeach));  
+        border-radius:14px; 
+        font-size:1.1rem; 
+        transition:all 0.2s ease-out;  
+        &:hover{
+            box-shadow: 5px 5px 15px rgb(var(--bs-gray-border));
+            transition:all 0.2s ease-out;
+        }
+        input{
+            @include chk_input;
+        }    
+        label{
+            @include chk_label; 
+            float: left;
+        } 
+    }
+    .agree-box{
+        margin: 0 auto;
+        position:relative;
+        h2{
+            padding-left:0.5rem;
+            font-size:1.1rem;
+            span{
+                color:rgb(var(--bs-red-primary));
+            }
+        }        
+        input{
+            @include chk_input;
+        }    
+        label{
+            @include chk_label;
+        }   
+    }
+    textarea{
+        overflow-y:auto;
+        width:100%;
+        height:9.37rem;
+        margin:1.5rem auto;
+        background-color:inherit;
+        border-radius:8px;
+        border:1px solid rgb(var(--bs-gray-border));
+        line-height: 1.4;
+        font-size:90%;
+        color:rgb(var(--bs-gray-600));
+    }
+    .row:has(a.confirm_agree){
+        margin:0;
+        a.confirm_agree{
+            display:block;
+            width:100%;
+            height:4.375rem;
+            margin-top:1.5rem;
+            border-radius:14px;
+            line-height:4.375rem;
+            text-align:center;
+            background-color:rgb(var(--bs-red-primary));
+            font-size:1.25rem;
+            color:rgb(var(--bs-white));
+        }
+    }   
+}
+
+// 반응형 사용 
+@include mobile-500{
+    .agree-container{
+        .agree-box{
+            label{
+                i{
+                    line-height: 1.5;
+                }
+            }
+        }        
+    }
+}