/********************************************************

 *  Modal

 ********************************************************/

/*-----------------------------------------------------------------------------
 *  Modal Terms
 *----------------------------------------------------------------------------*/

.modal_terms {position: fixed; left:0;top:0;width: 100%;height: 100%;background:rgba(0,0,0,0.7);opacity: 0;visibility: hidden; z-index: -1;transition: opacity 0.2s ease-in-out;}
.modal_terms.on {opacity: 1;visibility: visible;z-index: 9999;}
.modal_wrap {position: absolute;width:90%;max-width:1200px;height:80%;left: 50%; top:50%;transform: translate(-50%,-50%);border-radius: 5px; overflow: hidden;box-shadow: 0 0 30px rgba(0,0,0,0.3);}
.modal_cont {position: relative;height: 100%;background:#fff;}
.btn_modal_close {position: absolute;right:0;top:0;width:64px;height:64px;background:#000 url(../images/common/modal_close.png) no-repeat center center;background-size: 18px auto; text-indent: -9999px;z-index: 1000;}

.modal_wrap .modal_head {padding:15px 25px;border-bottom: 1px solid #ddd;}
.modal_wrap .modal_head h2 {font-size:24px; font-weight:800; color:#000;}
.modal_content {height: calc(100% - 65px); padding:50px 50px 80px; overflow: hidden;overflow-y: auto;scroll-behavior: smooth;}

/* Terms */
.terms dt { display:flex; align-items:center; font-size:20px; font-weight:600; color:#000; margin:20px 0; }
.terms dt:first-child {margin-top: 0;}
.terms dt .icon {display:inline-flex; align-items:center; width:40px; height:40px; border-radius:50%; background:#f6f6f6; padding:8px; margin-right:10px; flex-shrink:0; word-wrap:break-word; word-break:keep-all; }
.terms dd {font-size: 18px;font-weight: 500;color: #444;line-height: 1.5;margin-bottom: 10px; word-wrap:break-word; word-break:keep-all;}
.terms_head {margin-bottom: 50px}
.terms_head p {font-size: 20px; color:#000; font-weight: 600; word-wrap:break-word; word-break:keep-all;}
.terms_head .terms_desc {font-size: 18px; color:#444; font-weight: 500; margin:0 0 20px 0; }
.label_tit {margin: 30px 0 10px;font-size: 16px; color: #000; font-weight: 600;}
.label_df {display: flex;flex-wrap: wrap;justify-content:center;align-items: stretch;margin: 0 0 50px 0;}
.label_df li {position: relative;width:16.6666%; word-wrap:break-word; word-break:keep-all;}
.label_df li span {display: block;min-height: 100%; text-align: center;border: 1px solid #ddd;border-radius: 10px;margin: 5px;padding: 20px 10px;}
.label_df li span img {width:34px;}
.label_df li strong {display: block;font-size: 16px; font-weight: 600; color:#000;margin-top: 5px;}
.label_link {display: flex;flex-wrap: wrap;justify-content: space-between; align-content: stretch; align-items: stretch;margin: 0 -5px;}
.label_link li {width:50%;min-height:60px;margin: 5px 0}
.label_link li a {display: flex;align-items: center;min-height: 100%; background:#f6f6f6;border-radius: 10px;padding: 20px; margin:0 5px;font-size: 16px; color:#000;font-weight: 500; word-wrap:break-word; word-break:keep-all;}
.label_link li a span.icon {display: inline-block;width:24px;height: 24px; margin-right: 15px;flex-shrink: 0;}
.terms_tb {}
.terms_tb tr {}
.terms_tb tr th {padding: 20px; font-size: 16px; color: #222; font-weight: 600;border-top: 2px solid #000;border-bottom: 1px solid #ddd;line-height: 1.3}
.terms_tb tr td {padding: 20px; font-size: 15px; color:#444;border-bottom:1px solid #ddd; text-align: center;word-break: keep-all;word-wrap: break-word;line-height: 1.3}
.policy {}

@media screen and (max-width:1024px){
  .label_df li {width: 33.3333%;margin: 5px 0;}
}
@media screen and (max-width:768px){
  .btn_modal_close {width: 58px;height:58px;background-size: 16px auto;}

  .modal_wrap .modal_head {padding:15px 20px;}
  .modal_wrap .modal_head h2 {font-size: 20px;}
  .modal_content {padding: 20px 30px 40px; height: calc(100% - 60px);}

  .terms dt {font-size: 15px;margin: 20px 0 10px;}
  .terms dd {font-size: 14px;}
  .label_link li {width: 100%;}
}
@media screen and (max-width:640px){

  .terms_tb tr th {padding: 10px 5px;font-size: 14px;}
  .terms_tb tr td {padding:10px 5px;font-size: 14px;}
}
@media screen and (max-width:480px){
  .btn_modal_close {width:53px;height:53px;background-size: 14px auto;}

  .modal_wrap .modal_head {padding:12px 20px;}
  .modal_content {padding: 20px 25px 30px; height: calc(100% - 54px);}

  .terms_head p {font-size: 15px;}
  .terms_head .terms_desc {font-size: 14px;}
  .label_tit {margin:25px 0 10px;font-size: 15px;}
  .terms_tb tr th {padding: 10px 5px;font-size: 14px;}
  .terms_tb tr td {padding:10px 5px;font-size: 13px;}
  .label_df li {width: 50%;}
  .label_df li strong {font-size: 15px;}
  .label_df li span {padding: 15px 10px;}
  .label_df li span img {width:26px;}
  .label_link li a {padding: 15px;margin: 0 5px;font-size: 14px;}
  .label_link li a span.icon {width: 20px;height: 20px;}
  .terms dt .icon {width: 36px;height: 36px;}
}