﻿/* PC (해상도 1180px)*/
.mob{
    display:none;
}

.mob-nav-wrap{
    display:none;
}

@media all and (min-width:1180px) {

     .content {
        width: 100%;
        max-width: 1180px;
    }

}

/***************** 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1179px)*******************************************************/
@media all and (min-width:768px) and (max-width:1179px) {
    .subnav .content{
        width:100%;
    }
    
    .content {
        width: 90%;
    }
   
   
  
    /*.backimg>div:nth-of-type(1){
        display:none;

    }*/

    
    .backimg>div:nth-of-type(2){
        width:100% !important;
        clear:both;
        float:none;

    }

     .cont_txt{
         position:relative;
       width:100% !important; 
     }

     .cont_inner{
         background:rgba(255,255,255,0.8);
         padding:20px;
         position:absolute;
         left:50%;
         top:50%;
         transform:translate(-50%, -50%) !important;
         -webkit-transform:translate(-50%, -50%) !important;
         -moz-transform:translate(-50%, -50%) !important;
         -o-transform:translate(-50%, -50%) !important;
         -ms-transform:translate(-50%, -50%) !important;

     }

     .mgb200{
         margin-bottom:140px!important
     }


     .sec3{
         height:420px !important;
     }

     .merit{
         display:block !important;
         width:100%;
     }

    .merit> div:nth-of-type(1) {
       height:300px !important;
       width:100%;
       background-size:cover !important;
    }

        .merit > div:nth-of-type(2) {
        
        width:90%;
        margin:0 auto;
        }

    /*.merit_inner {
        margin-top:40px;
    }

    .merit_inner >div>span{
        font-size:3em!important
    }


 */

    .merit_inner > div > span {
    font-size:3em !important
    }


    .merit_inner >div{
        float:none !important;
        width:100% !important;
        height:auto !important;
        margin-top:40px !important;
    }

       .merit_inner .merit_txt{
        display:inline-block;
        width:auto;
        margin:0 auto;
        margin-left:40px;
        vertical-align:text-bottom;
        padding-bottom:6px;
        text-align:center;
        font-size:1.4em !important
        }

    .merit_inner {
    font-size:19px;
  
    }



       .merit_inner >div p:nth-of-type(2){
           margin:20px auto !important;
           width:100%;
           padding-left:73px;
       }


  }

/****************************************** 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*************************/
@media all and (max-width:767px) { 
         .content {
        width: 90%;
    }


       /*모바일 네비게이션*/
     .mob-nav-wrap{
         display:none;
         margin-bottom:100px;
     }


     .mgb200{
         margin-bottom:120px;
     }



     
    .Stit{
        font-size:1.2rem !important;
    }

    main{
        height:40vh;
    }


    .txtWrap h2{
        font-size:2.2rem;
        margin-bottom:30px;
    }
    .txtWrap .Mtit {
    line-height: 1.5em;
    margin-top: 30px;
}
    .txtWrap p{
        width:95%;
        margin:0 auto;
        font-size:16px;
    }

    .cultureWrap .Mtit2{
        font-size:1rem;
    }


    .subnav{
      display:block;
    }



    .subnav .content{
        width:100%;
    }
   
     .sec3{
         height:100% !important;
     }

    .backimg{
        position:relative !important;

    }
    /*.backimg div:nth-of-type(1){
        display:none;
    }*/


    .backimg div:nth-of-type(2){
        width:100% !important;
        height:300px;
        background-position:center !important;
    }

   .sec3 .content .cont_txt{
       width:auto !important;
      margin-top:40px;
       display:inline-block !important;
       padding-right:0 !important;
   }

   .sec3 .content {
        height:auto !important;
   }

   .sec3 .content .cont_inner{
       top:0;
       transform:translateY(0) !important ;
           font-size:1.1em !important;
   }

  .cont_txt .cont_inner .br{
       display:none;
   
   }

  .cont_txt .cont_inner strong{
      display:block;
      margin-bottom:18px;
      font-size:1.3em !important;
  }

     .merit{
         display:block !important;
         width:65%;
         margin:auto;
     }

    .merit> div:nth-of-type(1) {
       height:300px !important;
       width:100%;
       background-size:cover !important;
    }

        .merit > div:nth-of-type(2) {
        
        width:90%;
        margin:0 auto;
        }

    /*.merit_inner {
        margin-top:40px;
    }

    .merit_inner >div>span{
        font-size:3em!important
    }


 */

    .merit_inner > div > span {
    font-size:3em !important
    }


    .merit_inner >div{
        float:none !important;
        width:100% !important;
        height:auto !important;
        margin-top:40px !important;
    }

       .merit_inner .merit_txt{
        display:inline-block;
        width:auto;
        margin:0 auto;
        margin-left:40px;
        vertical-align:text-bottom;
        padding-bottom:6px;
        text-align:center;
        font-size:1.4em !important
        }

    .merit_inner {
    font-size:19px;
  
    }



       .merit_inner >div p:nth-of-type(2){
           margin:20px auto !important;
           width:100%;
           padding-left:73px;
       }

  
      br{
          display:none;
      }


      .txtWrap .mgb20{
          margin-bottom:0;
      }

}
 


@media all and (min-width:640px) and (max-width:768px){
  .imgWrap3 >div{
      margin-right:16px !important;
  }

  .imgWrap3> div>div{
      width:auto !important
  }

  .imgWrap3 > div img{
      width:100px! important;
  }

   .imgWrap3>div span{
      width:100%;
      font-size:1.1rem !important;
  }

    .imgWrap3:not(.imglayout)>div p{
      width:90%;
      font-size:16px !important;
      line-height:20px !important;
      letter-spacing:0.9px;
  }


}


/*컨텐츠 첫번째 아이콘*/ 

@media all and (max-width:640px) {
  .imgWrap3:not(.imglayout){
    display:block !important;        
  }

   .imgWrap3:not(.imglayout)>div{
    margin-right:0  ;
    margin-bottom:40px; 
    padding-bottom:20px;
    padding-top:20px;
    }

   .imgWrap3:not(.imglayout)>div>div{
    margin-bottom:0;         
  }


   
   .imgWrap3:not(.imglayout)>div>div img{
    width:100px !important;
            
  }

   .imgWrap3 >div span{
       margin-top:10px !important;
       display:block;
   }

   .imgWrap3 >div .Stit ~ p{

       margin-top:20px;
       font-size:1em !important;
       line-height:24px !important;
   }


   .layout1>div{
    height:250px;
   }



}


/************************************************************모바일 사이즈*************************************/

@media all and (max-width:488px){
     
    main{
        height:35vh;
    }

    .maintxtWrap{
        top:66%;
    }
    .maintxt.word{
        font-size:2.8rem;
        text-align:center;
    }

    .content{
         width:96%;
     }

     .mob-nav-wrap{
         margin-bottom:40px;
     }

     .txtWrap {
         margin-bottom:20px;
     }

     .txtWrap h2{
         font-size:1.6em;
         line-height:1.5em;
         letter-spacing:0.8px;
         margin-bottom:10px;
         
     }


     .sec2 .pdt20{
         padding-top:0 ;
     }

     .imgWrap3:not(.imglayout){
         padding-top:0;
     }

      .imgWrap3:not(.imglayout)>div>div img{
          width:60px !important;
      }


      .layout1>div{
          height:210px;
      }

      
    .imgWrap3:not(.imglayout)>div {
        margin-bottom:20px;
    }

    .mgb200{
        margin-bottom:60px;
    }


    .cont_txt{
        margin-top:20px !important;
    }

    .sec3 .content .cont_inner{
        font-size:1em !important;
    }


    .Mbtit {
        font-size:1.4em;
    }

    .merit_inner {
        margin-top:40px!important;
    }

    .merit> div:nth-of-type(1){
        height:220px !important;
    }

    .merit_inner >div{
    margin-top:10px !important;
    margin-bottom:48px !important;
    display:table;

    padding:10px;

    }

    .merit_inner >div span{
        /*display:none;*/
            display: flex;
    justify-content: center;
    }

    .merit_inner >div p{
        display:table-cell;
        
        vertical-align:middle;
    }

    .merit_inner .merit_txt{
        font-size:16px !important;
        margin:0;
        font-weight:500;
         vertical-align:middle !important;
         width:100%;
         height:100%;
        text-align:center;
       

         	

    }

    .merit > div:nth-of-type(2){
        width:100% !important;
    }

     /*.merit_inner .merit_txt:before{
    
        display:inline-block;
        width:20px;
        height:20px;
        border-radius:50%;
        background:blue;

     }*/

    .merit_inner >div p:nth-of-type(2){
        padding-left:8px;
        width:50% !important;
        font-size:14px;
    }

     .merit_inner >div p{
        font-size:14px;
    }


    .mgb160{
        margin-bottom:80px;
    }

    .Mtit{
        font-size:1rem;
        color:#666666;
        }

    .Mbtit{
      

        line-height:30px;

    }

    .t_line::before{
        content:none;
    }



}