@charset "UTF-8";

.diet .info {position: relative; margin-top: 50px; margin-bottom: 60px; padding: 30px 20px; border: 10px solid #edeff5; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: stretch;}
.diet .info .thumb {width: 300px;}
.diet .info .thumb img {width: 100%;}
.diet .info .box-info{width: calc(100% - 350px);}
.diet .info dt {position: relative; margin-top: 6px; margin-bottom: 17px; padding-bottom: 18px; font-family: 'Noto DemiLight'; font-size: 28px; color: #000; line-height: 1.2;}
.diet .info dt:after {content: ''; position: absolute; left: 0; bottom: 0; width: 35px; height: 1px; background: #0067d4;}
.diet .info dd {font-family: 'Noto Light'; font-size: 17px; color: #5b5b5b; line-height: 1.8;}

.diet .date {position: relative; text-align: center; border: 2px solid #d6d6d6; border-bottom: 0;}
.diet .date strong {display: block; padding: 21px 0; font-family: 'Noto Medium'; font-size: 24px; color: #183d93;}
.diet .date label {display: none;}
.diet .date .control {position: absolute; top: 50%; margin-top: -18px; }
.diet .date .control input {width: 30px; height: 30px; text-indent: -9999px;}
.diet .date .control.prev {left: 30px;}
.diet .date .control.prev input {background: url('../images/btn-date-prev.png') no-repeat center center; cursor: pointer;}
.diet .date .control.next {right: 30px;}
.diet .date .control.next input {background: url('../images/btn-date-next.png') no-repeat center center;}
.diet .date .control:after {position: absolute; top: 3px; left: 0; font-family: 'Noto Regular'; font-size: 15px; color: #333; text-indent: 0;}
.diet .date .control.prev:after {content: '이전'; left: 50px;}
.diet .date .control.next:after {content: '다음'; left: -50px;}

.diet .box-table {position:relative; line-height: 1.6;}
.diet .box-table table {position:relative; border-left:1px solid #bfbfbf; border-right:1px solid #bfbfbf;}
.diet .box-table thead th {padding:10px 10px; background:#0e4789; border-right:1px solid #083262; border-bottom:1px solid #083262; font-family: 'Noto Regular'; font-weight: normal; font-size:16px; line-height: 1.3; color:#fff; }
.diet .box-table thead th.title {font-size: 18px;}
/*.diet .box-table thead th:nth-child(7),
.diet .box-table thead th:nth-child(8) {display: none;}*/
.diet .box-table tbody th {padding:12px 20px; background:#fbfbfb; border-right:1px solid #bfbfbf; border-bottom:1px solid #bfbfbf; font-family: 'Noto DemiLight'; font-weight: normal; font-size:16px; color:#666; word-break: break-all;}
.diet .box-table tbody td {padding:22px 19px; background:#fff; border-right:1px solid #bfbfbf; border-bottom:1px solid #bfbfbf; font-family: 'Noto Light'; font-size:14px; color:#666; word-break: break-all;}
.diet .box-table tbody th {background: #f1f1f1; font-family: 'Noto Regular'; font-size: 16px; color: #222; word-break: break-all;}
/*.diet .box-table tbody td:first-child {background: #f1f1f1; font-family: 'Noto Regular'; font-size: 16px; color: #222;}*/
/*.diet .box-table tbody td:nth-child(7),
.diet .box-table tbody td:nth-child(8) {display: none;}*/
.diet .box-table .list li {position: relative; padding-left: 13px;}
.diet .box-table .list li:after {content: ''; position: absolute; left: 0; top: 10px; width: 3px; height: 3px; background: #666666;}
.diet .box-table .align-l {text-align:left;}
.diet .box-table .align-c {text-align:center;}
.diet .box-table .align-r {text-align:right;}

@media all and (max-width:960px) {
  .diet .box-table {overflow-x: hidden;}
  .diet .box-table table {width:870px;}
  .diet .box-table:after {content:''; position:absolute; right:0px; top:0px; width:100%; height:100%; background:rgba(60,81,82,0.4) url('../images/img_mobile_text.png') no-repeat center center;}
  .diet .box-table.on:after {display:none;}
  .diet .box-table thead th,
  .diet .box-table tbody th,
  .diet .box-table tbody td {padding:10px 8px;font-size:16px;}
}

@media all and (max-width:720px) {
    .diet .info .box-info {padding-left: 0; width: 100%; padding: 20px 0;}
    .diet .info .thumb {width: 100%;}
    .diet .date strong {font-size: 18px; padding: 21px 0 70px;}
    .diet .date .control {margin-top: -17px;}
    .diet .date .control.prev {left: 20px; top: auto; bottom: 20px; margin-top: 0;}
    .diet .date .control.next {right: 20px; top: auto; bottom: 20px; margin-top: 0;}
    .diet .date .control:after {top: 2px;}
}