@charset "UTF-8";@font-face{font-family:InkLipquid;src:url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/InkLipquid.woff) format("woff");font-weight:400;font-style:normal}.loaderwrap{padding-top:5px;margin:0 15px}.the-loader{width:20px;height:20px;margin:10px auto;border:4px solid #02C75A;border-top-color:transparent;border-radius:50%;animation:loader 1s infinite linear}.the-loader.hide{display:none}@keyframes loader{0%{transform:rotate(0)}to{transform:rotate(360deg)}}body{background-color:#fff;font-family:Pretendard Variable,Noto Sans KR,Apple SD Gothic Neo,맑은 고딕,Malgun Gothic,sans-serif;line-height:1.4;color:#0e111b}.container{max-width:1000px;margin:60px auto;padding:40px;border-radius:15px;border:3px solid #E5E6E7;background-color:#f8f9fa}@media (max-width: 1200px){.container{padding:40px}}@media (max-width: 600px){.container{padding:20px}}header{padding:20px 40px;background-color:#09ae34;position:sticky;top:0;z-index:9;display:flex;align-items:center;gap:40px;font-family:Pretendard Variable,Noto Sans KR,Apple SD Gothic Neo,맑은 고딕,Malgun Gothic,sans-serif}header .logo{height:40px;display:flex;cursor:pointer;transition:.3s;font-size:32px;font-weight:700;color:#fff;text-decoration:none;align-items:center;font-family:InkLipquid}header .logo img{width:40px;height:40px}header .logo span{font-size:22px;margin:0 10px;color:#fff;align-items:center;font-family:Pretendard Variable,Noto Sans KR,Apple SD Gothic Neo,맑은 고딕,Malgun Gothic,sans-serif}header nav ul{display:flex;gap:14px;align-items:center}header nav ul:before{content:"";width:1px;height:40px;background-color:#e5e5e5}header nav ul li a{font-size:18px;color:#fff;text-decoration:none}header nav ul li a.active{font-weight:700}@media (max-width: 600px){header{padding:14px 20px}header nav{display:none}}.headline{display:flex;justify-content:center;margin:10px auto}.headline .checklist-icon{font-size:35px;margin-right:10px;padding-top:6px}.headline h1{font-size:30px;font-weight:700}@media (max-width: 600px){.headline h1{font-size:20px}}.createtodo{height:80px;margin-bottom:30px;position:relative;display:flex;align-items:center}.createtodo .btn{flex-grow:1;max-width:130px;height:50px;display:flex;align-items:center;color:#fff;background-color:#02c75a;border:none}.createtodo .btn span{margin:0 5px;font-size:15px;font-weight:700}.createtodo input{flex-grow:1;padding:0 15px;height:50px;min-width:500px;border-radius:7px;border:solid 1px #02C75A;outline:0;background-color:#fff;margin-left:10px}.createtodo input::placeholder{color:#02c75a}.todo-list-tabs .category{height:55px;width:auto;display:flex;align-items:center}.todo-list-tabs .category-item{width:100px;height:40px;border-bottom:3px solid #E6E6E6;margin-left:15px;margin-right:15px;display:flex;color:#b4b2b2;align-items:center;justify-content:center;cursor:pointer;text-decoration:none;font-weight:700;font-size:20px}.todo-list-tabs .category-item.active-tab{color:#4cc570;border-bottom:4px solid #4CC570}.todo-list{height:auto;padding:25px;margin-bottom:30px;position:relative;align-items:center;overflow:hidden;font-family:Pretendard Variable,Noto Sans KR,Apple SD Gothic Neo,맑은 고딕,Malgun Gothic,sans-serif;font-size:20px;border:solid 3px #E5E6E7;margin-top:5px;border-radius:15px;background-color:#fff}.todo-list .todo-list-items{color:#000}.todo-list .todo-list-top{display:flex;align-content:center;justify-content:space-between}.todo-list .deleteAll{width:100px;height:40px;border:solid 3px #E6E6E6;border-radius:10px;background-color:#fff;margin:5px 10px;display:flex;flex-direction:row;vertical-align:middle;color:#b4b2b2;align-items:center;justify-content:center;cursor:pointer;text-decoration:none;font-weight:700;font-size:15px}.todo-list .deleteAll:hover{color:#009f47;background-color:#e8f8eb;border:3px solid #009F47}.todo-list .eachItem{height:55px;display:flex;flex-direction:row;margin:20px 10px 5px;border-radius:10px;background-color:#e8f8eb}.todo-list .eachItem input{margin:auto 10px;align-items:center;cursor:pointer}.todo-list .eachItem a{flex-grow:1;vertical-align:middle;display:flex;color:#535252;align-items:center;justify-content:center;cursor:pointer;text-decoration:none;font-weight:700}.todo-list .eachItem a:hover{color:#009f47}.todo-list .eachItem button{border:none;background:none;color:#aaa8a8}.todo-list .eachItem button:hover{color:#535252}.modal{justify-content:center;top:0;left:0;width:100%;height:100%;background-color:#0006}.modal .modalBody{position:absolute;top:50%;width:400px;height:300px;padding:40px;text-align:center;background-color:#fff;border-radius:10px;box-shadow:0 2px 3px #22242626;justify-content:center;transform:translateY(-50%);display:flex;flex-direction:column;font-size:15px}.modal .modalBody .created-at,.modal .modalBody .updated-at{display:flex;flex-direction:row;color:gray;margin:0 auto 5px}.modal .modalBody .created-at span,.modal .modalBody .updated-at span{font-size:20px;padding:3px 5px 0 0}.modal .modalBody input{width:300px;height:30px;font-size:20px;justify-content:center;padding:20px;margin:40px auto 0;outline:none;border:solid 3px #E6E6E6;border-radius:10px}.modal .modalBody input:focus{color:#009f47;background-color:#e8f8eb;border:none}.modal .modalBody .buttons{display:flex;margin:30px auto 15px;justify-content:center}.modal .modalBody .buttons button{position:left;border:1px solid rgb(170,168,168);background:none;color:#aaa8a8;margin:0 10px;width:70px;border:solid 3px #E6E6E6;border-radius:5px;font-size:15px}.modal .modalBody .buttons button:hover{color:#009f47;background-color:#e8f8eb;border:none}.content{margin:70px auto}.about{font-family:NanumSquare-EB,나눔고딕,Dotum,돋움,Helvetica,Arial,AppleSDGothicNeo,sans-serif;display:flex;flex-direction:column;align-items:center}.about .content-head h1{font-size:40px;padding:0 0 30px;font-weight:700;color:#212121;text-align:center}.about .content-head p{align-items:center;display:flex;flex-direction:column;font-size:18px}.about .content-head img{width:100%;height:215px;margin:30px auto 20px}.about .content-middle,.about .content-end{display:flex;margin:20px auto}.about .content-middle h2,.about .content-end h2{color:#333;font-size:20px;font-weight:700;padding-left:20px;width:230px}.about .content-middle p,.about .content-end p{font-size:12px;line-height:1.5;color:#b4b2b2;font-weight:400}.about .content-end{margin-top:60px}.about .content-end .grid-container{display:grid;grid-template-columns:130px 500px;border-top:1px solid #eeeaea}.about .content-end .grid-container .grid-item{font-size:12px;padding:12px 0;border-bottom:1px solid #eeeaea}
