*{box-sizing:border-box;margin:0;padding:0;font-family:Arial,sans-serif}body{color:#222;background-color:#f7f9fb;margin:0;padding:0;font-family:Arial,sans-serif}a{color:#0070f3;text-decoration:none}button{cursor:pointer;color:#fff;background-color:#0070f3;border:none;border-radius:6px;padding:.75rem 1.5rem;font-size:1rem;transition:background-color .2s}button:hover{background-color:#005dc1}h1,h2,h3,h4{margin-bottom:10px;font-family:Roboto,sans-serif}header{max-width:1200px;margin:0 auto;padding:20px 20px 10px}header>div{max-width:1200px;margin:0 auto;transition:all .3s}header>div>h2{text-align:center;margin-bottom:0}.courseTopPage{text-align:center;max-width:800px;margin-left:auto;margin-right:auto;padding-bottom:3rem;padding-left:1.8rem;padding-right:1.8rem}.courseTopPage ul{text-align:left;margin:0 auto;padding:0;display:inline-block}.courseTopPage ul li{margin-bottom:10px;font-size:1rem}.courseTopPage ul li a{font-size:1rem}.course-page{gap:30px;max-width:1200px;margin:0 auto;padding:20px;display:flex}.course-sidebar{background-color:#fff;border-radius:10px;width:25%;min-width:250px;padding:20px;transition:all .3s;box-shadow:0 4px 8px #0000001a}.sidebar h3{color:#444;letter-spacing:1px;margin-bottom:20px;font-size:1.2rem}.regular-sidebar ul{padding-left:0;list-style:none}.regular-sidebar li{margin:15px 0;font-weight:900}.regular-sidebar li.active a{color:#0073e6;font-weight:700}.regular-sidebar a{color:#333;font-size:1rem;text-decoration:none;transition:color .3s}.regular-sidebar a:hover{color:#0073e6}.regular-sidebar .locked{color:#b5b5b5;font-weight:400}.locked{cursor:not-allowed;position:relative}.locked:after{content:"";opacity:0;pointer-events:none;color:#fff;white-space:nowrap;background:#333;border-radius:4px;margin-top:4px;padding:4px 8px;font-size:12px;transition:opacity .2s;position:absolute;top:100%;left:0}.locked{position:relative}.locked:hover:after{content:"コース購入者のみ視聴可能です。";z-index:100;color:#fff;opacity:1;background:#333;padding:5px;transition-delay:.2s;position:absolute;top:100%;left:0}.course-content{background-color:#fff;border-radius:10px;width:75%;padding:20px;transition:all .3s;box-shadow:0 4px 8px #0000001a}.course-content h2{color:#333;margin-bottom:20px;font-size:1.5rem;font-weight:600}.video-player iframe{border:none;width:100%;max-width:100%;height:450px}.video-description,.transcription{margin-top:20px}.video-description h4,.transcription h4{color:#333;margin-bottom:10px;font-size:1.2rem}.video-description p{color:#555;font-size:1rem}.transcription-content{color:#444;max-height:400px;padding-right:10px;font-size:.95rem;line-height:1.6;overflow-y:auto}.transcription-content::-webkit-scrollbar{width:8px}.transcription-content::-webkit-scrollbar-thumb{background-color:#0073e6;border-radius:10px}.transcription-content::-webkit-scrollbar-track{background:#f1f1f1}@media (max-width:768px){.course-page{flex-direction:column;padding:10px}.course-sidebar{width:100%;display:none}.course-content{width:100%;padding:10px}.sidebar-btn{color:#fff;cursor:pointer;background-color:#0073e6;border-radius:5px;margin-top:20px;padding:10px;display:block}.sidebar-btn:hover{background-color:#005bb5}.sidebar-btn:focus{outline:none}.transcription-content{overflow:scroll}}.loginContainer{background:#fff;border-radius:12px;max-width:470px;margin:3rem auto;padding:1.5rem;box-shadow:0 8px 20px #0000000d}.loginContainer img{width:150px;margin:auto auto 20px;display:block}.loginTitle{text-align:center;margin-bottom:1.5rem;font-size:1.5rem}.loginForm{flex-direction:column;gap:1rem;display:flex}.input{border:1px solid #ddd;border-radius:6px;padding:.75rem 1rem;font-size:1rem}.error{color:red;text-align:center;margin-top:-.5rem;font-size:.875rem}@media (max-width:500px){.loginContainer{margin:3rem .6rem;padding:.6rem}}.horizontal-line{background-color:#ccc;border:none;width:100%;height:2px;margin:30px 20px}.pnWrapper{align-items:center;gap:25px;row-gap:30x;flex-direction:column;display:flex}.pnWrapper a{color:#333;background-color:#f0f0f0;border-radius:5px;padding:10px 20px;text-decoration:none;transition:background-color .3s}.pnWrapper a:hover{background-color:#ddd}.transcription table{border-collapse:collapse;width:100%;margin:1rem 0;font-size:1rem}.transcription th,.transcription td{text-align:center;border:1px solid #ccc;padding:8px 12px}.transcription th{background-color:#f0f0f0}.transcription hr{background:#ccc;border:0;height:2px;margin:2rem 0}.transcription pre,.transcription code{font-family:Fira Code,monospace;font-size:1rem;line-height:1.5}.transcription pre{background:#282a36;border-radius:5px;margin-bottom:15px;padding:1rem;overflow:auto}.transcription code{background:#282a36;border-radius:3px;padding:.2rem .4rem}.transcription p{white-space:pre-line;overflow-wrap:break-word;margin-bottom:1.6rem;line-height:2}.transcription h2{border-bottom:4px solid #005bb5;border-left:4px solid #005bb5;margin-top:30px;padding-left:6px;font-size:1.4rem;display:inline-block}.transcription img{border:1px solid #d3d3d3;border-radius:10px;width:100%}.inline-code{white-space:nowrap;color:#f8f8f2;background:#2d2d2d;border-radius:4px;padding:.1em .3em;font-family:Fira Code,monospace;font-size:.9em;display:inline}.regular-sidebar{display:block}.mobile-sidebar{display:none}.mobile-sidebar li a{font-weight:700}.mobile-sidebar li.active a{color:#0073e6}.mobile-sidebar .locked{color:#827777;font-weight:400}.sidebar-open-button{display:none}@media (max-width:768px){.regular-sidebar{display:none}.mobile-sidebar,.sidebar-open-button{display:block}}.mobile-sidebar{z-index:10;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:.98;background-color:#ecececcc;width:100%;height:100%;padding:70px 30px;position:fixed;top:0;left:0;overflow-x:hidden}.mobile-sidebar ul{list-style-type:none}.mobile-sidebar a{color:#333;font-size:15px;line-height:2}.mobile-sidebar a:hover{color:#0080ff}.mobile-sidebar-close{display:none}.sidebar-open-button{z-index:11;color:#fff;opacity:.85;background-color:#4485f5cc;padding:6px 10px;position:fixed;top:10px;left:10px;box-shadow:0 4px 10px #0000001a}