@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */


.history {}
.history .head {text-align:center; margin-bottom:50px;}
.history .head .tit {font-size:32px; line-height:1.4em; color:#242424; font-family: 'Jeju Hallasan', cursive;}
.history .head .year {font-size:62px; line-height:1.4em; color:#c6bdb0; font-weight:700; font-family: 'Roboto', sans-serif;}
.history .row {display:flex; justify-content: space-between;}
.history .info {}
.history .info .col {position:relative; padding-bottom:50px; padding-left:180px;}
.history .info .col:before {content:"";position:absolute; top:7px; left:120px; width:1px; height:100%; background:#d1cac0; z-index:-1}
.history .info .col:last-child {padding-bottom:0;}
.history .info .col:last-child:before {display:none;}
.history .info .col:after {content:"";position:absolute; top:7px; left:112px; width:18px; height:18px; border-radius:100%; border:4px solid #68502e; background:#fff; z-index:0}
.history .info .col .year {position:absolute; top:0; left:0; font-size:25px; line-height:1.4em; color:#68502e;font-weight:700;}
.history .info .col .cnt {font-size:16px; line-height:1.4em; padding-top:5px;}
.history .img {padding-left:30px;}

.greeting {}
.greeting .video-box {margin-bottom:60px;}
.greeting .row {display:flex;}
.greeting .photo {flex:1 1 477px; max-width:477px;}
.greeting .photo .pic {position:relative; height:0; padding-bottom:90.4%;}
.greeting .photo .pic img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; min-height:100%; object-fit:contain; transition:0.3s;}
.greeting .info {flex:1 1 auto; width:1%; padding-left:50px;}
.greeting .info .tit {display:block; margin-bottom:25px; font-size:30px; line-height:1.4em; color:#242424; font-family: 'Jeju Hallasan', cursive;}
.greeting .info .cnt {margin-bottom:25px; font-size:16px; line-height:1.6em;}
.greeting .info .last {text-align:right; font-size:16px ;line-height:1.6em;}
.greeting .info .last strong {font-weight:500; font-size:18px;}
.greeting .info .last .name {font-size:25px; letter-spacing:.1em;}
.greeting .br {display:block}

.doc-title {position:relative; font-size:25px; line-height:1.4em;font-weight:500; color:#333; margin-bottom:25px; padding-left:30px;}
.doc-title:before {content:"";position:absolute; top:7px; left:0; width:20px; height:20px; background:url('../images/sub/doc_dot.png') 50% 50% no-repeat;}

.brand-head {border:1px solid #ddd; display:flex; align-items:center; border-radius:5px; padding:40px 0; margin-bottom:50px;}
.brand-head .logo {flex:1 1 400px; max-width:400px; text-align:center; padding:0 20px;}
.brand-head .info {flex:1 1 auto; width:1%; padding:20px 65px; border-left:1px solid #ddd;}
.brand-head .info dl dt {font-size:22px; line-height:1.4em; color:#242424; margin-bottom:15px;font-family: 'Jeju Hallasan', cursive;}
.brand-head .info dl dd {font-size:16px;line-height:1.6em;}

.brand-menu-cnt {margin-bottom:55px;}
.brand-menu-cnt .row {position:relative; display:flex;}
.brand-menu-cnt .info {flex:1 1 605px; max-width:605px;}
.brand-menu-cnt .info .tit {color:#68502e; font-size:25px; line-height:1.4em; font-weight:500; margin-bottom:20px;}
.brand-menu-cnt .info .tit span {font-size:20px;}
.brand-menu-cnt .info .cnt {font-size:16px; line-height:1.7em;}
.brand-menu-cnt .info .cnt dl {display:flex; margin-bottom:20px;}
.brand-menu-cnt .info .cnt dl:last-child {margin-bottom:0;}
.brand-menu-cnt .info .cnt dl dt {flex:1 1 110px; max-width:110px; font-size:20px; line-height:1.4em; color:#333;font-weight:500; position:relative; padding-left:15px;}
.brand-menu-cnt .info .cnt dl dt:before {content:"";position:absolute; top:9px; left:0; width:6px;height:6px; background:#b1a799; border-radius:50%;}
.brand-menu-cnt .info .cnt dl dd {padding-left:10px; flex:1 1 auto; width:1%; font-size:16px; line-height:1.4em;}
.brand-menu-cnt .info .img-row {position:absolute; bottom:0; left:0; display:flex; margin-left:-30px;}
.brand-menu-cnt .info .img-row .col {width:50%; padding-left:30px;}
.brand-menu-cnt .img {flex:1 1 auto; width:1%; padding-left:30px;}
.brand-menu-cnt.type2 .info .cnt {margin-bottom:25px;}
.brand-menu-cnt.type2 .info .cnt:last-child {margin-bottom:0;}
.brand-menu-cnt .img-group {display:flex; margin-left:-30px; margin-top:30px;}
.brand-menu-cnt .img-group .col {width:25%; padding-left:30px;}

.brand-interior {}
.brand-interior .row {display:flex; flex-wrap:wrap; align-items:center;  margin-left:-30px;}
.brand-interior .col {width:50%; text-align:center; padding-left:30px; margin-bottom:30px;}
.brand-interior .tit {color:#68502e; font-size:24px; line-height:1.6em; font-weight:500; margin-bottom:25px;}
.brand-interior .cnt {font-size:16px; line-height:1.7em; margin-bottom:20px;}
.brand-interior .cnt:last-child {margin-bottom:0;}
.brand-interior .f-s-20 {font-size:20px;}
.brand-interior .f-s-27 {font-size:27px;}

.logistics-top {text-align:center; font-size:36px; line-height:1.4em; color:#242424;font-weight:500; margin-bottom:50px;}
.logistics-img {margin-bottom:50px;}
.logistics-img .row {display:flex; flex-wrap:wrap; margin-left:-30px; margin-bottom:-30px;}
.logistics-img .col {padding-left:30px; width:33.333333%; text-align:center; margin-bottom:30px;}
.logistics-img .col:nth-child(1) {width:66.6666666%;}
.logistics-img .tit {padding-top:15px; font-size:18px; line-height:1.4em;}
.logistics-cnt {text-align:center; font-size:20px; line-height:1.8em; color:#242424;font-weight:500; margin-bottom:50px;}
.logistics-cnt .br {display:block}
.logistics-img-type2 {margin-bottom:25px; padding-top:50px;}
.logistics-img-type2 .row {display:flex;}
.logistics-img-type2 .col {position:relative; width:27.05%;}
.logistics-img-type2 .col:nth-child(1) {width:45.65%}
.logistics-img-type2 .col .label {position:absolute; top:-50px; left:30px; font-size:20px; line-height:1.2em; color:#242424;font-weight:500; background:rgba(198,189,176,.80);text-align:center; display:table; width:100px; height:100px; padding:5px; border-radius:50%; z-index:1}
.logistics-img-type2 .col .label .cell {width:100%;height:100%; display:table-cell; vertical-align:middle; border:1px solid rgba(255,255,255,.80); border-radius:50%;}

.logistice-cnt-type2 {margin-bottom:50px;}
.logistice-cnt-type2 dl {margin-bottom:30px;}
.logistice-cnt-type2 dl:last-child {margin-bottom:0;}
.logistice-cnt-type2 dl dt {position:relative; padding-left:24px; font-size:20px; line-height:1.4em;font-weight:500; margin-bottom:10px;}
.logistice-cnt-type2 dl dt:before {content:"";position:absolute; top:6px; left:0; width:13px; height:13px; border-radius:50%; border:3px solid #68502e}
.logistice-cnt-type2 dl dd {padding-left:24px;}

.logistice-system {background:#f0f0f0; padding:70px 0;}
.logistice-system .row {display:flex; align-items:center; padding:0 80px;}
.logistice-system .photo {flex:1 1 500px; max-width:500px;}
.logistice-system .info {padding-left:50px; flex:1 1 auto; width:1%;}
.logistice-system .info .tit {color:#242424; font-size:36px; line-height:1.4em;font-weight:500; margin-bottom:25px;}
.logistice-system .info .cnt {font-size:18px; line-height:1.7em;}

.compet-cnt {}
.compet-cnt .head {font-size:25px; line-height:1.4em; color:#242424; margin-bottom:15px;}
.compet-cnt .head strong {font-weight:500;}
.compet-cnt .head .f-s-30 {font-size:30px;}
.compet-cnt .row {display:flex; flex-wrap:wrap; margin-left:-20px; align-items:center; margin-bottom:60px;}
.compet-cnt .row .col {width:50%; padding-left:20px;}
.compet-cnt .group-img {margin-bottom:30px;}
.compet-cnt .group-img:last-child {margin-bottom:0;}
.compet-cnt .group-img .row {display:flex; margin-left:-100px;}
.compet-cnt .group-img .col {width:50%; padding-left:100px;}
.compet-cnt .group-img .row:nth-child(even) {direction:rtl}
.compet-cnt .group-img .text-box {text-align:left; margin-left:30px;}
.compet-cnt .group-img .text-box .box-wrap {position:relative; background:#f8f8f8;  display:flex; width:100%; height:350px; padding:10px; border-radius:5px;}
.compet-cnt .group-img .text-box .box-wrap:after {content:"";position:absolute; top:10px; left:10px; width:59%; height:60%; border:4px dashed #c6bdb0; border-right:0;border-bottom:0; border-radius:8px 0 0 0;}
.compet-cnt .group-img .text-box .box {position:relative; width:100%;  padding:30px;}
.compet-cnt .group-img .text-box .box:after {content:"";position:absolute; top:0; right:0; width:37%; height:100%; border:5px solid #68502e; border-left:0; border-radius:0 8px 8px 0}
.compet-cnt .group-img .text-box .box:before {content:"";position:absolute; bottom:0; left:0; width:100%; height:34.5%; border:5px solid #68502e; border-top:0; border-radius:0 0 8px 8px}
.compet-cnt .group-img .tit-step {position:relative; margin-left:-50px; margin-bottom:20px;display: inline-block; padding:12px 50px;  z-index:1}
.compet-cnt .group-img .tit-step:after {content:"";position:absolute; top:0; left:0; width:100%; height:100%; background:#3e3528; transform:skew(-20deg); -ms-transform:skew(-20deg);}
.compet-cnt .group-img .tit-step .tit {position:relative; z-index:2;font-size:30px; line-height:1.2em; color:#fff;font-weight:700; transform:skew(0); -ms-transform:skew(0);}
.compet-cnt .group-img  dl dt {font-size:20px; line-height:1.4em; color:#68502e; font-weight:500; margin-bottom:20px;}

.fran-step {}
.fran-step ul {display:flex;flex-wrap:wrap; margin-left:-70px; margin-bottom:-30px;}
.fran-step ul li {position:relative; text-align:center; width:calc(25% - 70px); margin-left:70px; margin-bottom:30px;}
.fran-step ul li .label {position:absolute; top:44px; left:0; width:103px; height:97px; font-size:30px; line-height:70px; background:url('../images/sub/label.png') 0 0 no-repeat;; color:#fff;font-weight:700;}
.fran-step ul li .box {border:1px solid #ddd; margin-left:29px; padding:44px 15px 0; min-height:330px;}
.fran-step ul li .icon {border-bottom:1px solid #3e3528; padding-bottom:30px; margin-bottom:30px; padding-left:25px;}
.fran-step ul li dl dt {font-size:20px; line-height:1.4em; color:#454545;font-weight:500; margin-bottom:15px; letter-spacing:-.90px;}
.fran-step ul li dl dd {font-size:16px; line-height:1.6em;}

.fran-price-top {text-align:center; color:#68502e; font-size:25px ;line-height:1.4em;margin-bottom:50px;}
.fran-price-top strong {font-weight:500;}

.table-head {display:flex; justify-content: space-between; margin-bottom:5px; color:#3e3528;}
.table-head .tit {font-size:20px; line-height:1.4em; font-weight:500;}
.table-head .info {text-align:right; font-size:16px ;line-height:1.4em;}
.table-head .info .bar {padding:0 15px;}
.table01 table {width:100%; border-collapse:collapse; border-spacing:0px;}
.table01 table thead th {height:53px; padding:9px 20px; color:#454545; font-size:18px; font-weight:500; line-height:1.5em; background:#f0f0f0; border:1px solid #ddd;}
.table01 table tbody td {height:53px; padding:9px 20px; font-size:16px; font-weight:300; line-height:1.5em; text-align:center; border:1px solid #ddd;}
.table01 table tfoot th {height:53px; padding:9px 20px; color:#454545; font-size:20px; font-weight:500; line-height:1.5em; background:#f0f0f0; border:1px solid #ddd;}
.table01 table th:first-child,
.table01 table td:first-child {border-left:0;}
.table01 table th:last-child,
.table01 table td:last-child {border-right:0;}
.table01 .left {text-align:left;}
.table01 .red {color:#ed1c24}

.table-cnt {padding:20px; margin-bottom:50px;}
.table-cnt p {text-indent:-19px; padding-left:19px; font-size:16px; line-height:1.4em; color:#686868;}
.table-cnt ul {padding-top:25px;}
.table-cnt ul li {margin-bottom:5px; font-size:16px; line-height:1.4em; color:#686868; text-indent:-10px; padding-left:10px;}
.table-cnt ul li:last-child {margin-bottom:0;}
.table-cnt ul li strong {font-weight:500;color:#68502e;}

.fran-drawing {}
.fran-drawing ul {display:flex; flex-wrap:wrap; margin-left:-30px; margin-bottom:-30px;}
.fran-drawing ul li {width:50%; padding-left:30px; margin-bottom:30px;}