@charset "utf-8";

.faq-content { font-family: 'Noto Sans KR', sans-serif; }
.faq-category .div-tab { margin-bottom:15px; }
.faq-category .dropdown { margin-bottom:15px; }
.faq-category .active a, .list-category .selected a { color:crimson; font-weight:bold !important; }
.faq-box { border:1px solid #ddd; background:#fafafa; padding:20px 15px 3px; margin-bottom:15px; }
.faq-img img, .faq-html img, .faq-content img { width:auto; max-width:100%; border:0; margin-right: 15px; }
.faq-content .panel-body p { padding:0; margin:0; font-size:18px; color:#444; line-height:44px; word-break: keep-all; }
.faq-none { padding:50px 0; }

.div-panel.panel-group .panel { padding: 20px; background: #f8f8f8; }
.div-panel.panel-group .panel:nth-of-type(2n) { background: #fff; }
.div-panel.panel-group .panel:last-child { border-bottom: 1px solid #ddd; }
.div-panel.panel-group .panel-heading a { font-weight:400; border-top: 0px; }
.div-panel.panel-group .panel-heading a .panel-icon::after { display:none; content: ""; }
.div-panel.panel-group .panel-heading a.active { color: #71ae22; border-bottom: 0px !important; }
.div-panel.panel-group .panel:last-child .panel-heading a { border-bottom: 0px; }
.div-panel.panel-group .panel-body { padding-left: 60px; }
.div-panel.panel-group .panel .panel-heading a { display: block; overflow: hidden; }
.div-panel.panel-group .panel-icon { float:left; width:54px; }
.div-panel.panel-group .panel-subject { float:left; width:calc(100% - 100px); line-height: 25px; }
.div-panel.panel-group .panel-heading a.active .faq-arrow--down { transform: rotate(135deg); top: 0px; right: 40px; float: right; }

.faq-arrow { position: relative; display: inline-block; margin: 10px 0 0 0; padding: 8px; box-shadow: 2px -2px 0 0 #666 inset; transition:all .2s;  }
.faq-arrow--down { transform: rotate(-45deg); bottom: 0px; right: 40px; float: right; }

@media all and (max-width:480px) {
.div-panel.panel-group .panel-heading a, .faq-content .panel-body p  { display: inline; font-size:15px; line-height:40px; word-break: keep-all; }
.faq-arrow--down, .div-panel.panel-group .panel-heading a.active .faq-arrow--down { right: 15px; }
}

.faq-content { border-top: 1px solid #ddd; }
.panel-default > .panel-heading { border: 0px solid #ddd; }
.div-panel.panel-group .panel-subject { float: left; width: calc(100% - 100px); line-height: 25px; height: 39px; line-height: 32px; }

.faq-category { margin-bottom:25px; }
.faq-category .menu li a { position:relative; display:block; font-weight:500; color:#333; text-align:center;  } 
.faq-category .menu a.on,
.faq-category .menu li:hover a { color:#00a720}
.faq-category .menu li a.on:before, 
.faq-category .menu li:hover a:before { content:''; position:absolute; left:-1px; top:-1px; width:calc(100% + 2px); height:calc(100% + 2px);  border:1px solid #00a720; z-index:2;}

@media (min-width:801px ) {
.faq-category .menu { display:flex; width:100%; }
.faq-category .menu li { flex:1; border:1px solid #ddd; }
.faq-category .menu li:not(:last-of-type) { border-right:none;}
.faq-category .menu li a { height:58px; font-size:16px; line-height:58px; }
}
@media (max-width:800px) {
.faq-category .menu { border:1px solid #ddd; border-top:none;}
.faq-category .menu li { float:left; width:33.33%; border-top:1px solid #ddd; border-right:1px solid #ddd; }
.faq-category .menu li:nth-of-type(3n) { border-right:none;}
.faq-category .menu li a { height:44px; font-size:16px; line-height:44px; }
@media (max-width:400px){
.faq-category .menu li a { font-size:13px; }
}