@charset "utf-8";

#PR_Quality .contentTxt { margin-top: 30px; } 
.content_01 { padding-bottom: 60px; margin-top: 40px; } 
.qualList>ul>li {width: 33.33333%;padding: 10px;} 
.qualList>ul { display: flex; margin: -10px; flex-flow: wrap; font-size: 0; } 
.qualList>ul>li>a {display: block;width: 100%;height: 227px;border: 1px solid #e4e4e4;padding: 30px;position: relative;transition: all .3s;} 
.qualList>ul>li>a:hover, .qualList>ul>li>a:active { border: 1px solid #0E74FF; } 
.qualTitle { font-family: 'Heebo-Bold'; font-weight: bold; font-size: 24px; color: #404040; position: relative; padding-bottom: 10px; } 
.qualTitle:after { content: ''; position: absolute; width: 45px; height: 1px; background: #707070; bottom: 0; left: 0; } 
.qualsubTItle { margin-top: 15px; font-family: 'SCDream7'; font-size: 18px; color: #888888; } 
.qualCont { margin-top: 20px; font-family: 'Noto Sans KR'; font-weight: 400; color: #404040; font-size: 14px; padding-right: 35px; } 


.qualList>ul>li>a:before, .qualList>ul>li>a:after { content: ''; position: absolute; right: 30px; top: 30px; width: 20px; height: 2px; background: #888888; transition: all .3s; } 
.qualList>ul>li>a:after { height: 20px; width: 2px; margin-top: -9px; margin-right: 9px; } 
.qualList>ul>li>a:hover:before, .qualList>ul>li>a:hover:after { background: #0E74FF; transform: rotate(180deg); } 
.list_li { display: inline-block; vertical-align: top; bottom: -2px; position: relative; } 
.list_li>a { font-family: 'SCDream5'; font-size: 24px; padding: 0px 20px; line-height: 2; color: #999999; } 
.list_li.active { border-bottom: 2px solid #0e74ff; } 
.list_li.active>a, .list_li:hover>a {color: #000000;} 
.list_ul { border-bottom: 2px solid #e4e4e4; font-size: 0; } 
.content_top .list_hd { display: none; } 

@media screen and (min-width: 769px) { ul.list_ul { display:block !important; height: 52px !important; } } 
 
 
@media screen and (max-width: 768px){
    .content_01 { padding-bottom: 30px; } 
    .qualList>ul>li {width: 100%;padding: 10px 0;} 
    .list_li.active { border: 0; } 
    .list_hd>li.active { border-bottom: 1px solid #404040; } 
    .content_top { position: relative; } 
    .content_top .list_hd { display: block; } 
    .list_hd>li { position: relative; width: 100%; } 
    .list_ul {display: none;font-size: 0;position: absolute;z-index: 1;top: calc(100% + 10px);width: 100%;} 
    .list_ul>li { display: inline-block; vertical-align: top; width: 100%; position: relative; padding: 0; } 
    .list_hd>li:after { content: ''; position: absolute; width: 5px; border-top: 9px solid #0E74FF; border-left: 9px solid transparent; border-right: 9px solid transparent; top: 11px; right: 15px; } 
    .list_hd>li.active a { text-align: left; font-size: 19px; display: block; margin: 0 auto; font-family: 'SCDream6'; width: 100%; padding: 0; } 
    .list_ul>li:not(:first-child) a { border-top: 0; } 
    .list_ul>li a { border-radius: 0; text-align: left; padding: 10px 20px; font-size: 14px; width: 100%; display: block; color: #888888; border: 1px solid #D0D0D0; background: #ffffff; font-family: 'Noto Sans KR'; font-weight: 700; } 
    .list_hd>li.active.list_active a { background-color: #ffffff; color: #232323; } 
    .list_ul>li.active>a, .list_ul>li:hover a { color: #232323; transition: all .3s;} 
    .list_ul>li a { font-family: 'Noto Sans KR'; padding: 8px 10px; } 
    #PR_Quality .contentTxt { margin-top: 0; } 
    .qualTitle { font-size: 18px; }     
    .qualList>ul { margin: -10px 0; }     
    .qualList>ul>li>a { padding: 20px; }     
    .qualList>ul>li>a:before, .qualList>ul>li>a:after { right: 20px; width: 16px; }     
    .qualList>ul>li>a:after { width: 2px; height: 16px; margin-top: -7px; margin-right: 7px; }     
    .qualTitle:after { width: 35px; }     
    .qualsubTItle { font-size: 14px; }     
    .qualCont { margin-top: 13px; } 
}