.qa_container{ 
    width: 100%; max-width: 1400px;
    padding:40px 0px;
}

.qa_area{ width: 100%;}
.qa_area > ul{ 
    margin: 0; padding:0; width: 100%;
    list-style: none;
}
.qa_area > ul > li{ 
    border-bottom: 1px var(--coffee) dashed ; 
    padding:0; width: 100%; 
    color:var(--drakCoffee); 
    transition: all .2s linear; 
    position: relative;
    
}
.qa_area > ul > li:nth-child(odd){background-color: var(--lightGray);}
.qa_area > ul > li:hover{ color:var(--drakGreen);}
.qa_area > ul > li.hover{color:#fff; background-color: var(--drakGreen);}

.qa_area > ul > li > .qa_items_area{ 
    width: calc(100% - 45px);
    padding: 0px; display:inline-block;
}
.qa_area > ul > li > .qa_items_area > h4{
    margin: 0; width: 100%; max-width: 100%; cursor: pointer; 
    font-weight: 500; font-size:16pt; display:inline-flex;
    padding: 10px 10px 10px 56px;
}

.qa_area > ul > li > .qa_items_area > h4 > span{
    position: absolute; right: calc(100% - 46px);
    width:auto; height:auto; border:0px #c00 solid;
    text-align: center;
}

.items{
    width:27px; height:27px; background-color: var(--coffee); border-radius: 10px;
    color:#fff; font-weight: 900; display: inline-flex; justify-content: center; 
    align-items: center; position: absolute; top:12px; right:10px; transform: translateY(-0%); 
    font-size:21pt; padding: 0; user-select: none; cursor: pointer; transition: all .2s linear;
}

.items > .items_row{
    width: 15px; height:2px; background-color: #fff; 
    position: absolute; top:50%; left:50%; transform: translate(-50%,-50%);
    opacity: 1;
}
.items > .items_column{
    width: 2px; height:15px; background-color: #fff;
    position: absolute; top:50%; left:50%; transform: translate(-50%,-50%);
    transition: all .2s linear;
}
.qa_area > ul > li:hover > .qa_items_area > .items{background-color: var(--drakGreen);}
.qa_area > ul > li.hover > .qa_items_area > .items{
    background-color: #fff;
}
.qa_area > ul > li.hover > .qa_items_area > .items > .items_column{
    opacity: 0; transform: translate(-0%,-50%) rotate(45deg);
}

.qa_area > ul > li.hover > .qa_items_area > .items > .items_row{
    background-color: var(--drakGreen);
}


.qa_area > ul > li > .qa_contents_area{
    overflow: hidden; width: 100%; height:0;
    background-color: #fff;
    transition: height .2s linear;
}

.qa_area > ul > li > .qa_contents_area > .qa_contents{
    padding:20px; font-size:14pt; color:var(--black);
    
}

.qa_area > ul > li.hover > .qa_contents_area{ 
    height: 0;
}

@media screen and ( max-width:559px) {
    .qa_area > ul > li > .qa_items_area > h4{ font-size:14pt}
    .items{width:21px; height:21px; border-radius: 8px; }
    .qa_area > ul > li > .qa_contents_area > .qa_contents{
        font-size:12.5pt
    }
    
}