/* =========================================== 
mobile.css Responsive Layout 
=========================================== */ 

/************************************ 
1024px ÀÌÇÏ 
************************************/ 

@media screen and (max-width:1024px){ 

.hero{ 

      padding:70px 0;
	  
} 

.hero h1{

      font-size:40px;
	  
} 

.hero p{ 
	  max-width:80%;
      font-size:18px;
	  
} 

.service-wrap{

      flex-wrap:wrap;
	  gap:20px;
	  
} 

.service-box{ 

      width:30%; 
	  flex:none;
	  
} 





.footer-wrap {
	width: calc(100% - 50px);
	margin-left: 50px;
	display: flex;
	flex-wrap: wrap;
	gap: 20px 30px;
}

.footer-wrap a {
	display: block;
	position: relative;
	z-index: 100;
	pointer-events: auto;
}
   
	   
.footer-wrap a:hover{
       
	   color:#0079a8; 
	   
} 


} 


/************************************ 
768px ÀÌÇÏ (Tablet) 
************************************/ 

@media screen and (max-width:768px){

header{ 

      padding:20px 0;
	  
} 
	  
	  
.logo{ 

      width:180px;
	  
} 

.hero{ 

      min-height:auto;

	  padding:60px 0px;
	  
	  text-align:left;
} 

.hero-left{ 

      text-align:left;
	  
} 

.hero h1{

      font-size:34px;
	  
} 

.hero p{

	  max-width:80%;
      font-size:16px;
	  
} 

.service-wrap{

      display:block;
	  
} 

.service-box{

      width:85%;
	  margin-bottom:25px;
	  
} 

.service-box:last-child{

      margin-bottom:0;
	  
} 

.service-box h3{ 

      font-size:18px;
	  
} 

.service-box a{

      padding:10px;
	  
} 

.footer-wrap {
	width: calc(100% - 50px);
	margin-left: 50px;
	display: flex;
	flex-wrap: wrap;
	gap: 20px 30px;
}

.footer-wrap a {
	display: block;
	position: relative;
	z-index: 100;
	pointer-events: auto;
}
   
	   
.footer-wrap a:hover{
       
	   color:#0079a8; 
	   
} 



/*.shape-red{

      opacity:1;
	  width:400px;
	  right:-20px;
	  
} 
*/
} 

/************************************ 
480px ÀÌÇÏ (Mobile) 
************************************/ 

@media screen and (max-width:480px){

      body{ 

	  font-size:15px;
	  
} 

      header{ 

      padding:15px 0;
	  
} 

.logo{

      width:150px;
	  
} 

.hero{ 

      padding:40px 0px;
	  
} 

.hero h1{

      font-size:28px;
	  margin-bottom:15px;
	  
} 

.hero p{ 

	  max-width:80%;
	  font-size:15px;
	  line-height:1.6;
	  
} 

.service-box{ 

	  margin-bottom:18px;
	  
} 

.service-box h3{ 

	  font-size:17px; 
	  
} 

.service-box a{

	  font-size:15px; 
	  padding:14px; 
	  border-radius:6px;
	  
} 

.footer-wrap {
	width: calc(100% - 50px);
	margin-left: 50px;
	display: flex;
	flex-wrap: wrap;
	gap: 20px 30px;
}

.footer-wrap a {
	display: block;
	position: relative;
	z-index: 100;
	pointer-events: auto;
}
   
	   
.footer-wrap a:hover{
       
	   color:#0079a8; 
	   
} 





/*.shape-red{ 

	  width:120px;
	  right:-30px;
	  opacity:1;
	  
} 
*/
} 

/************************************ 
Ultra Small 
************************************/ 

@media screen and (max-width:360px){

.hero h1{ 

	  font-size:24px;
	  
} 

.hero p{ 

	  max-width:80%;
	  font-size:14px;
	  
} 

.service-box h3{ 

	  font-size:16px;
	  
} 

.service-box a{

	  font-size:14px;
	  
} 

.footer-wrap{

	  display:block;
	  
} 

.footer-wrap a{

       color:#f39200;
	   font-weight:600;
	   transition:.3s;
	   
	   } 
	   
	   
.footer-wrap a:hover{
       
	   color:#0079a8; 
	   
} 


}


@media (max-width: 767px) {

    .privacy-table--items {
        min-width: 680px;
        font-size: 13px;
    }

    .privacy-table--items th,
    .privacy-table--items td {
        padding: 13px 12px;
    }

    .privacy-table--items .col-purpose {
        width: 28%;
    }

    .privacy-table--items .col-required {
        width: 14%;
    }

    .privacy-table--items .col-items {
        width: 58%;
    }

    .privacy-table--items .privacy-list {
        padding-left: 16px;
    }

}

@media (max-width: 767px) {

    .privacy-law-list {
        margin: 16px 0 24px;
        font-size: 14px;
        line-height: 1.75;
    }

    .privacy-law-title {
        margin-bottom: 3px;
    }

    .privacy-law-list ul {
        padding-left: 22px;
    }

    .privacy-law-list li {
        line-height: 1.75;
        word-break: keep-all;
    }

}

@media (max-width: 767px) {
    .privacy-content {
        width: 100%;
        padding: 0 20px;
    }
}

@media (max-width: 767px) {

    .privacy-table-wrap {
        margin: 20px 0 30px;
        overflow: visible;
    }

    .privacy-table,
    .privacy-table thead,
    .privacy-table tbody,
    .privacy-table tr,
    .privacy-table th,
    .privacy-table td {
        display: block;
        width: 100% !important;
    }

    /* ¸ð¹ÙÀÏ¿¡¼­´Â ±âÁ¸ Çì´õ¸¦ ¼û±è */
    .privacy-table thead {
        display: none;
    }

    /* °¢ ÇàÀ» Ä«µåó·³ */
    .privacy-table tbody tr {
        margin-bottom: 20px;
        border: 1px solid #d8d8d8;
        background: #fff;
        border-radius: 8px;
        overflow: hidden;
    }

    .privacy-table td {
        position: relative;
        min-height: 44px;
        padding: 12px 15px 12px 125px;
        border: 0;
        border-bottom: 1px solid #eeeeee;
        text-align: left !important;
        line-height: 1.65;
        word-break: keep-all;
    }

    .privacy-table td:last-child {
        border-bottom: 0;
    }

    /* Ç׸ñ¸í */
    .privacy-table td::before {
        content: attr(data-label);
        position: absolute;
        left: 0;
        top: 0;
        width: 105px;
        height: 100%;
        padding: 12px 10px;
        box-sizing: border-box;
        background: #f5f5f5;
        color: #222;
        font-weight: 700;
        text-align: center;
        border-right: 1px solid #eeeeee;
    }
}


@media (max-width: 480px) {

    .privacy-table td {
        padding: 11px 12px 11px 105px;
        font-size: 14px;
    }

    .privacy-table td::before {
        width: 90px;
        padding: 11px 6px;
        font-size: 13px;
    }

    .privacy-table tbody tr {
        margin-bottom: 15px;
        border-radius: 6px;
    }
}


/* =========================================================
   °³ÀÎÁ¤º¸Ã³¸®¹æħ Å×À̺í - Mobile
   ========================================================= */

@media screen and (max-width: 767px) {

    .privacy-table-wrap {
        width: 100%;
        margin-bottom: 25px;
        overflow-x: auto;
    }

    .privacy-table {
        min-width: 620px;
        font-size: 14px;
        line-height: 1.6;
    }

    .privacy-table th,
    .privacy-table td {
        padding: 10px 8px;
    }

    .privacy-table-trustee .col-trustee {
        width: 150px;
    }

    .privacy-table-trustee .col-work {
        width: 300px;
    }

    .privacy-table-trustee .col-period {
        width: 170px;
    }
}

/* =========================================
   °³ÀÎÁ¤º¸Ã³¸®¹æħ Å×ÀÌºí ¸ð¹ÙÀÏ
========================================= */

@media screen and (max-width: 767px) {

    .privacy-table-wrap {
        margin: 15px 0 30px;
        overflow-x: auto;
        padding-bottom: 5px;
    }

    .privacy-table {
        /*
         * ¸ð¹ÙÀÏ¿¡¼­µµ Ç¥ ±¸Á¶¸¦ À¯ÁöÇϱâ À§ÇØ
         * ÃÖ¼Ò ³Êºñ¸¦ ÁöÁ¤ÇÏ°í °¡·Î ½ºÅ©·Ñ ó¸®
         */
        min-width: 620px;
        width: 620px;

        font-size: 13px;
        line-height: 1.55;
    }

    .privacy-table th,
    .privacy-table td {
        padding: 9px 10px;
    }

    .privacy-table th {
        font-size: 13px;
    }
}