@charset "utf-8";
/* CSS Document */
        
        .article {
            margin-bottom: 2rem;
            overflow: hidden;
        }
        
        .title-container {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 1.8rem 2rem;
            cursor: pointer;
        }
        
        .title-container:hover {
            background-color: rgba(236,190,103,0.1);
        }
        
        .title {
            font-size: 2rem;
            font-weight: 700;
            color: #ecbe67;
            margin: 0;
        }
        
        .toggle-btn {
            position: relative;
            width: 3.2rem;
            height: 3.2rem;
			cursor: pointer;
            transition: all 0.3s ease;
            flex-shrink: 0;
            margin-left: 1.5rem;
        }
        
        .toggle-btn::before,
        .toggle-btn::after {
            content: "";
            position: absolute;
            top: 50%;
            left: 50%;
            background-color: #ecbe67;
            transition: all 0.3s ease;
            transform: translate(-50%, -50%);
        }
        
        .toggle-btn::before {
            width: 1.2rem;
            height: 0.22rem;
        }
        
        .toggle-btn::after {
            width: 0.2rem;
            height: 1.2rem;
        }
        
        .expand-checkbox:checked + .title-container .toggle-btn::after {
            height: 0;
        }
        
        .content {
            padding: 0 2rem;
            max-height: 0;
            overflow: hidden;
			color: #be9a57;
            
        }
        
        .expand-checkbox:checked ~ .content {
            max-height: 50rem;
            padding: 2rem;
        }
        
        .content p {
            margin-bottom: 1.5rem;
        }
        
        .content p:last-child {
            margin-bottom: 0;
        }