@charset "utf-8";



h2{font-family:"SBAggro";font-weight:400;color:var(--color1)}
.f_agr{font-family:"SBAggro";}

.ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;  /* 말줄임 적용 */
}

.multi_ellipsis{
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-height: 1.2em;
  max-height: 2.4em;
}

/* Mobile */
.m_top{background:var(--color2) url("/images/07_law/main/visual_bg.png") no-repeat left top;background-size:100%;padding: 20px;}
.main_visual{text-align:center;padding-top:150px;font-size:22px;color:var(--white);font-weight:200;}
.main_visual strong{display:inline-block;font-size:30px;margin-top:-5px;}



.condition{background:rgba(0,0,0,0.7);border-radius:10px;padding:20px 30px;margin-top:30px;}
.condition:after{display:block;content:"";clear:both;}
.condition h2{float:left;color:var(--white);font-size:20px;font-weight:100;}
.condition ul{float:right;}
.condition ul li{color:var(--white);padding:5px 0;}
.condition ul li span{font-weight:200;}
.condition ul li strong{display:inline-block;position:relative;text-align:right;width:90px;padding-right:20px;}
.condition ul li strong:after{display:block;content:"";width:4px;height:6px;background:var(--btnbg) no-repeat -44px -33px;position:absolute;right:0;top:50%;transform:translate(-50%,-50%)}



.m_link{background:var(--color1);border-radius:10px;margin-top:20px;}
.m_link ul:afteR{display:block;content:"";clear:both;}
.m_link li{float:left;width:50%;border-bottom:dashed 1px var(--gray3)}
.m_link li span{display:none;}
.m_link li a{position:relative;display:block;text-align:center;color:var(--white);border-radius:10px;padding:20px 0 20px 20px;}
.m_link li a:before{display:block;content:"";width:24px;height:24px;background:url("/images/07_law/main/icon_set.png") no-repeat left top;position:absolute;}
.m_link li:nth-child(1) a:before{background-position:0 0}
.m_link li:nth-child(2) a:before{background-position:0 -50px}
.m_link li:nth-child(3) a:before{background-position:0 -100px}
.m_link li:nth-child(4) a:before{background-position:0 -150px}
.m_link li:nth-child(5) a:before{background-position:0 -200px}
.m_link li:last-child{border:none;}



.m_bbs{position:relative;background:var(--gra1);padding:30px 20px;}
.m_bbs h2{font-size:24px;padding-bottom:15px;}
.m_bbs .mb_box{position:relative;margin-bottom:40px;}
.m_bbs .mb_box ul{background:var(--white);border-radius:20px;box-shadow: 0 0 10px rgba(0,0,0,0.1);padding:0 20px;}
.m_bbs .mb_box li{padding:20px 0;border-bottom:dashed 1px var(--gray5)}
.m_bbs .mb_box li:last-child{border:none;}
.m_bbs .mb_box li a{display:inline-block;color:var(--color2);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:calc(100% - 85px);}
.m_bbs .mb_box li span{display:inline-block;color:var(--gray2);float:right;}

.m_bbs .mb_box .more{position:absolute;top:5px;right:10px;}
.m_bbs .mb_box .more a{position:relative;display:block;color:var(--color2);font-weight:500;padding-left:20px;}
.m_bbs .mb_box .more a:before{display:block;content:"";width:11px;height:11px;background:var(--btnbg) no-repeat -169px -30px;position:absolute;top:5px;left:0;}


/* Tablet */
@media (min-width: 768px) {


.m_top{background-size:70%;}
.m_top:after{display:block;content:"";clear:both;}

  
.main_visual{text-align:left;padding-top:0;text-shadow: 0 0 10px rgba(0,0,0,0.6);position:absolute;top:100px;left:20px;}
.condition{float:left;width:40%;margin-top:190px;}
  
.m_link{float:right;width:50%;background:var(--white);}
.m_link li{float:none;width:100%;}
.m_link li a{display:block;text-align:left;padding:0;}
.m_link li a:before{top:20px;left:10px;}
.m_link li a:after{display:block;content:"";clear:both;}
.m_link li strong{display:inline-block;padding:20px 0 20px 40px;float:left;width:30%;height:60px;background:var(--color1)}
.m_link li span{display:inline-block;font-size:14px;background:var(--white);padding:20px 10px;float:right;width:70%;height:60px;color:var(--black)}
.m_link li:first-child strong{border-radius:10px 0 0 0;}
.m_link li:last-child strong{border-radius:0 0 0 10px;}
.m_link li:first-child span{border-radius:0 10px  0 0;}
.m_link li:last-child span{border-radius:0 0 10px 0;}


   
    
}

/* Desktop */
@media all and (min-width:1023px) {

.menu>ul>li{padding:20px 0;}
    
.m_top{padding:0;height:520px;}
.main_visual{top:120px;left:60px;}

    
 
.condition{margin:250px 0 0 60px;padding:20px 30px;width:35%;}
.condition h2{font-size:24px;padding-top:10px}
.condition ul li{padding:10px 0;}
.condition ul li span{font-weight:200;font-size:18px;}
.condition ul li strong{font-size:20px;}


.m_link{margin:160px 20px 0 0;}


.m_bbs{padding:30px;z-index:1;overflow: hidden;}
.m_bbs:before{display:block;content:"";background:var(--white);width:100%;height:300px;border-radius:50px 0 0 0;position:absolute;top:110px;left:60px;z-index:-1;}
.m_bbs:after{display: block;content: "";clear: both;}

.m_bbs .mb_box{float:left;width:31.333333%;margin:0 1%}


}



@media all and (min-width:1600px) {
    
.l_search{margin-top:0;} 
    

.main_visual{font-size:36px;}
.main_visual strong{font-size:48px;}
.main_visual br{display:none;}

    
.condition{float:left;width:330px;margin:290px 0 0 60px;padding:20px 30px;}

.m_link{width:480px;margin:160px 60px 0 0;}
.m_link li a:before{left:25px;}
.m_link li strong{padding:20px 0 20px 60px;}   


  
.m_bbs{padding:60px;}

  
}

/*번역*/
.translated-ltr .condition h2{float: none;}
.translated-ltr .condition ul{float: none;}
.translated-ltr .condition ul li strong{width: auto;}
.translated-ltr .m_link li{width: 100%;}
.translated-ltr .m_bbs .mb_box{padding-bottom: 30px;}
.translated-ltr .m_bbs .mb_box .more{top: auto;bottom: 0;}
@media all and (min-width:768px) {
.translated-ltr .condition{width: 100%;}
.translated-ltr .m_link{width: 100%;}
}
@media all and (min-width:1023px) {
.translated-ltr .m_top{height: 550px;}
.translated-ltr .main_visual{font-size: 20px;}
.translated-ltr .condition h2{font-size: 18px;}
.translated-ltr .condition h2 br{display: none;}
.translated-ltr .condition{width: 35%;}
.translated-ltr .m_link{width: 50%;margin-top: 220px;}
.translated-ltr .m_bbs h2{font-size: 20px;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;}
}
@media all and (min-width:1600px) {
.translated-ltr .m_bbs h2{padding-right: 25%;}
.translated-ltr .m_bbs .mb_box{padding-bottom: 0;}
.translated-ltr .m_bbs .mb_box .more{top: 5px;bottom: auto;}
}