@charset "utf-8";

/* COMMON */
.sub-cont {margin-top:10rem;}

/* SUB TOP AREA */
.sub-toparea {text-align:center; padding-top:13rem;}
.sub-toparea .page-depth01 {font-size:5.3rem; color:#303030; font-weight:700; margin-bottom:3.5rem;}
.sub-toparea .page-location {margin-top:4rem;}
.sub-toparea .page-location ul {display:flex; justify-content: center; align-items: center;}
.sub-toparea .page-location ul li {color:#666; display:flex; align-items:center;}
.sub-toparea .page-location ul li::after {display:inline-block; content:''; background:url(/images/sub/ico-pglocation-depth01-arr.png) no-repeat center; width:6px; height:10px; margin:0 1.5rem;}  
.sub-toparea .page-location ul li:last-child::after {display:none;}
.sub-toparea .page-location ul li.has-depth02 {position: relative;}
.sub-toparea .page-location ul li .depth02-btn {color:#303030; display:inline-flex; align-items:center; justify-content:center;}
.sub-toparea .page-location ul li .depth02-btn .ico {margin-left:1rem; transition:.2s;}
.sub-toparea .page-location ul li .depth02-box {display:none; position:absolute;top: 3.5rem; left:50%; transform:translateX(-50%); width: 60%; min-width:10rem; padding:1rem; border:1px solid #666;background: #fff;z-index: 1;}
.sub-toparea .page-location ul li .depth02-box a {display:block; padding:0.5rem;font-size: 1.5rem;}
.sub-toparea .page-location ul li .depth02-box.long-st {min-width: 16rem;}
.sub-toparea .page-location ul li .depth02-btn.active .ico {transform:rotate(180deg);}

.sub-toparea .svisual {position: relative; height:50.6rem; background-repeat:no-repeat; background-size:cover; background-position:center; margin-top:10rem;}
.sub-toparea .svisual:not(.bg-none):after {display:block; content:''; animation: move-wall 1s ease-in 0.2s forwards; position: absolute; top:-1px; right:0; width:calc(100% + 2px); height:calc(100% + 2px); background-color: #fff; }

@keyframes move-wall {
    100% {
        width: 0;
    }
}

.sub-toparea .svisual.bg-none {height:0 !important;}
.sub-toparea .svisual.bg-company {background-image:url(/images/sub/sv-company.png);}
.sub-toparea .svisual.bg-ceo {background-image:url(/images/sub/sv-ceo.png);}
.sub-toparea .svisual.bg-philosophy {background-image:url(/images/sub/sv-philosophy.png);}
.sub-toparea .svisual.bg-location {background-image:url(/images/sub/sv-location.png);}
.sub-toparea .svisual.bg-performance {background-image:url(/images/sub/sv-performance.png);}
.sub-toparea .svisual.bg-service-info {background-image:url(/images/sub/sv-service-info.png);}
.sub-toparea .svisual.bg-performance {background-image:url(/images/sub/sv-performance.png);}
.sub-toparea .svisual.bg-registration {background-image:url(/images/sub/sv-registration.png);}
.sub-toparea .svisual.bg-marketing {background-image:url(/images/sub/sv-marketing.png);}
.sub-toparea .svisual.bg-interior {background-image:url(/images/sub/sv-interior.png);}
.sub-toparea .svisual.bg-production {background-image:url(/images/sub/sv-production.png);}
.sub-toparea .svisual.bg-education {background-image:url(/images/sub/sv-education.png);}


/* ANIMATION */
@media ( min-width: 768px ) {
    .hov-ani {transition:all .4s;}
    .hov-ani:hover {transform:scale(0.95);}
}

.img-move-ani {position:relative; overflow:hidden;}
.img-move-ani::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index:3; background:#fff; transition:left 1s ease-in-out;}
.img-move-ani.aos-animate::before {left: 100%;}

.img-zoom-ani {position:relative; overflow:hidden;}
.img-zoom-ani img {transform:scale(1.1);}
.img-zoom-ani.aos-animate img {transform:scale(1); transition:2s ease;}


/* SUB TITLE */
.sub-title .inner {padding-top:15rem; padding-bottom:9rem; line-height: 1;}
.sub-title small {font-size:1.8rem; color:#999999; font-weight:600; letter-spacing:0.1em;}
.sub-title h3 {font-size:4.2rem; font-weight:700; margin-top:1.5rem;}
.sub-title h3 strong {color:#ec3c47;}
.sub-title .desc {font-size:1.8rem; color:#666; font-weight:500; line-height: 1.666; margin-top:2rem;}
.sub-title .img {margin-top:5rem;}


/* SECTION TITLE */
.sec-title {font-size:3rem; font-weight:600; line-height:1; letter-spacing:0; margin-bottom:3rem;}
.sec-title:before {display:inline-block; content:''; width:8px; height:8px; background:url(/images/sub/sec-title-bull.png) no-repeat center; vertical-align:top; margin-right:1rem;}


/* SUB TAB */
.sub-tab {display:flex; justify-content:center; align-items:center; height:12rem; border-bottom:1px solid #dddddd; text-align:center; position:sticky; top:10rem; background:#fff; z-index:2; transition:.2s;}
.sub-tab a {display:inline-block; font-size:2rem; color:#666666; font-weight:500; margin:0 3.5rem; transition:.2s;}
.sub-tab a.active {color:#ec3c47; font-weight:600;}

.sub-tab.fixed {height:8rem;}
.sub-tab.fixed a {font-size:1.8rem;}


/* TABLE STYLE */
.tb-style01 {border-top:2px solid #303030; width:100%;}
.tb-style01 th {font-size:1.8rem; font-weight:800; line-height:1.666; text-align:center; padding:1.5rem 3.5rem; border-right:1px solid #dddddd; border-bottom:1px solid #dddddd;}
.tb-style01 td {font-size:1.8rem; font-weight:500; line-height:1.666; color:#666666; padding:2rem 3.5rem; text-align:center; border-right:1px solid #dddddd; border-bottom:1px solid #dddddd;}
.tb-style01 th:last-child,
.tb-style01 td:last-child {border-right:none;}


/* SECTION BACKGROUND STYLE */
.has-bgdeco:not(.auto-height) {background-color:#f7f7f7; padding-top:9rem; padding-bottom:16rem; position:relative;}
.has-bgdeco.auto-height {position:relative;}
.has-bgdeco.auto-height:before {display:block; content:'';  width:100%; background-color:#f7f7f7; position:absolute; top:0; left:0;}
.has-bgdeco .bg-txt {font-size:13rem; color:#f7f7f7; letter-spacing:0; font-weight:800; position:absolute; top:-9rem; right:0; height:9rem; line-height:0.7;}

.has-bgimg {background-color:#f7f7f7; padding-top:0; padding-bottom:16rem; position:relative;}
.has-bgimg .bg-img {transform: translateY(-10rem); margin-top: 5rem;}



/* [[  == DREAM 소개 == ]] */
/* 회사소개 */
#company-cont .sec-tit {font-size:4.2rem; font-weight:700;display: flex;flex-direction: column;align-items: flex-start; margin-bottom: 8rem;}
#company-cont .sec-tit span {position:relative; display:inline-block; z-index: 1;}
#company-cont .sec-tit span .num {position:absolute; bottom:2.5rem;right: -3rem; opacity:0.3; color:#dddddd; font-size:8rem;line-height: 1;letter-spacing: -0.09em;z-index: -1;}
#company-cont .sec01 {padding:15.5rem 0;}
#company-cont .sec01 .graff {display:flex; align-items:center;}
#company-cont .sec01 .graff .mna {position:relative; display:inline-flex; align-items:center; justify-content:center; width: 22rem;height: 22rem; border-radius:50%;  font-size:5rem; font-weight:700; color:#fff; flex-shrink: 0;}
#company-cont .sec01 .graff .mna::before {display:inline-block; content:''; width:100%; height:100%; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);border-radius: 50%;background: #d93441 url(/images/sub/company-sec01-mna-bgdeco.png) no-repeat center bottom 2rem; z-index: -1;}
#company-cont .sec01 .graff .mna::after {display:inline-block; content:''; width:calc(100% + 2rem); height:calc(100% + 2rem); position:absolute; top:50%; left:50%;border-radius: 50%;transform:translate(-50%,-50%); background:#f7d6d9; animation: mna-border-ani 2.5s ease-in infinite forwards; z-index: -2;}
#company-cont .sec01 .graff .arrow {margin:0 3.5rem;flex-shrink: 0;}
#company-cont .sec01 .step-wrap {width: 100%;}
#company-cont .sec01 .step-list {display:flex; justify-content:space-between; align-items: center;}
#company-cont .sec01 .step-list + .step-list {margin-top:4rem;}
#company-cont .sec01 .step-list dl {width: 16.2rem; height:15rem; display:flex; flex-direction:column; justify-content:center; border-top:3px solid #222222; border-bottom:1px solid #aaaaaa;}
#company-cont .sec01 .step-list dt {color:#999999; font-weight:700;line-height: 1;}
#company-cont .sec01 .step-list dd {font-size:2.2rem; font-weight:700;line-height: 1.2727;margin-top: 1rem;}

@keyframes mna-border-ani {
    0%{
        transform:translate(-50%,-50%) scale(0.8);
        opacity:1;
    }
    80%{
        transform:translate(-50%,-50%) scale(1.3);
        opacity:0;
    }
    100%{
        transform:translate(-50%,-50%) scale(1.3);
        opacity:0;
    }
}

#company-cont .sec02 {padding:13.5rem 0 12rem 0; background:url(/images/sub/company-sec02-bg.png) no-repeat center;}
#company-cont .sec02 .sec-tit {color:#fff;}
#company-cont .sec02 .sec-tit span .num {opacity:0.1; color: #fff;}
#company-cont .sec02 ul {display:flex; flex-wrap:wrap; margin-top:2rem; max-width:90rem}
#company-cont .sec02 ul li {margin-top:6rem; width:33.333%; padding-right:2rem;}
#company-cont .sec02 ul li .ico {}
#company-cont .sec02 ul li dl {margin-top:2.5rem;}
#company-cont .sec02 ul li dt {font-size:1.8rem; color:#fff; font-weight:500;}
#company-cont .sec02 ul li dd {font-size:1.8rem; color:#fff; font-weight:700; margin-top:1rem;}
#company-cont .sec02 ul li dd .num {font-size:5.3rem; color:#fff; font-weight:700;}
#company-cont .sec03 {padding:16rem 0; position:relative; display:flex; align-items:center; background-image:url(/images/sub/company-sec03-bgdeco01.png), url(/images/sub/company-sec03-bgdeco02.png); background-position:center left, bottom 16rem right 0; background-repeat:no-repeat;}
#company-cont .sec03 .imgbox {margin-right:17rem;}
#company-cont .sec03 .txtbox {flex-shrink:0; padding-right:3%;}
#company-cont .sec03 .txtbox p {margin-top:3rem; font-size:1.8rem; color:#666; line-height:1.777;}


/* CEO 메세지 */
#ceo-cont .sec01 {padding:16rem 0 0; margin-top:8rem;}
#ceo-cont .sec01 .inner {display:flex; position:relative;}
#ceo-cont .sec01 .inner::after {display:block; content:''; position:absolute;bottom: 0;left: 8rem;background: url(/images/sub/ceo-profile-bgdeco.png) no-repeat center/cover; z-index:-1;width: 100vw;height: 100%;}
#ceo-cont .sec01 .inner >  * {width:50%; flex-shrink: 0;}
#ceo-cont .sec01 .imgbox {margin-top:-8rem;}
#ceo-cont .sec01 .txtbox {padding: 9rem 0 9rem 9rem;}
#ceo-cont .sec01 .txtbox small {font-size:2rem; color:#ec3c47; font-weight:600;}
#ceo-cont .sec01 .txtbox h3 {font-size:3.6rem; font-weight:700; line-height:1.472; position:relative;}
#ceo-cont .sec01 .txtbox h3:before {display:inline-block; content:''; width:6.9rem; height:5.8rem; background:url(/images/sub/ceo-text-deco.png) no-repeat center/contain; position:absolute; top:-3rem; left:-3rem;}
#ceo-cont .sec01 .txtbox .txt {margin-top:3rem; font-size:1.8rem; color:#666666; font-weight:500; line-height:1.888;}
#ceo-cont .sec01 .txtbox .name {display:flex; align-items:center; margin-top:4rem;line-height: 1;}
#ceo-cont .sec01 .txtbox .name dt {font-size:1.8rem; font-weight:600; line-height:1.555; display:flex; align-items:center;}
#ceo-cont .sec01 .txtbox .name dt::after {display:inline-block; content:''; width:2px; height:3rem; background-color:#4d4d4d; margin:0 2rem;}
#ceo-cont .sec01 .txtbox .name dd {font-size:2.4rem; font-weight:700;}
#ceo-cont .sec02 {background:url(/images/sub/ceo-history-bg-deco.png) no-repeat bottom right; padding:12rem 0 15rem 0;}
#ceo-cont .sec02 .inner {display:flex; }
#ceo-cont .sec02 h3 {font-size:3.4rem; font-weight:700; margin-right:17rem; flex-shrink: 0;}
#ceo-cont .sec02 .cont {display:flex;width: 100%;}
#ceo-cont .sec02 .cont ul {width:50%; flex-shrink:0;}
#ceo-cont .sec02 .cont ul li {font-size:1.8rem; color:#666; font-weight:500; margin-bottom:2rem;}
#ceo-cont .sec02 .cont ul li:last-child {margin-bottom:0;}


/* 운영철학 */
#philosophy-cont .sec01 ul li {background-color:#fff; border:1px solid #e4e4e4; padding:3.5rem 8rem; margin-bottom:2rem; display:flex;}
#philosophy-cont .sec01 ul li:last-child {margin-bottom:0;}
#philosophy-cont .sec01 ul li .number {margin-top:1.5rem; flex-shrink:0;}
#philosophy-cont .sec01 ul li .number strong {font-size:2.5rem; font-weight:800; font-style:italic; display:inline-block; position:relative;line-height: 1;}
#philosophy-cont .sec01 ul li .number strong::after {display:block; content:''; width:100%; height:1px; background-color:#aaaaaa;}
#philosophy-cont .sec01 ul li .number span {display:block; color:#aaaaaa; font-size:1.5rem; font-weight:600;line-height: 1;margin-top: 0.5rem;}
#philosophy-cont .sec01 ul li .ico {margin-left:9rem; width:14rem; height:14rem; flex-shrink:0; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background-color:#fdf7f7;}
#philosophy-cont .sec01 ul li .txtbox {margin-top:1.5rem; margin-left:7rem;}
#philosophy-cont .sec01 ul li .txtbox  dt {font-size:2.6rem; font-weight:500;}
#philosophy-cont .sec01 ul li .txtbox  dt strong {font-weight:700;}
#philosophy-cont .sec01 ul li .txtbox  dd {color:#666666;font-weight: 500; line-height:1.5; margin-top:1.5rem;}


/* 오시는 길 */
#location-cont .sec01 {padding-top:15rem; padding-bottom:16rem;}
#location-cont .sec01 article {display:flex; padding-top:6rem;}
#location-cont .sec01 .root_daum_roughmap {max-width:73rem; width:100%; height:90rem;}
#location-cont .sec01 .root_daum_roughmap .wrap_map {height:90rem;}
#location-cont .sec01 .root_daum_roughmap .wrap_controllers {display:none;}
#location-cont .sec01 .txtbox {margin-top: 16rem;margin-left: 16rem;width: calc(100% - 73rem);position: relative;}
#location-cont .sec01 .txtbox::before {display: block;content:''; width:calc(100% + 16rem); height:2px; background:#303030;position: absolute;left: -16rem;}
#location-cont .sec01 .txtbox ul {padding-top:2rem;}
#location-cont .sec01 .txtbox ul li {padding-top:3rem; padding-bottom:5rem; border-bottom:1px solid #dddddd;}
#location-cont .sec01 .txtbox ul li h4 {font-size:3.2rem; font-weight:700; display:flex; justify-content:space-between; cursor:pointer;}
#location-cont .sec01 .txtbox ul li h4 .arr {display:inline-block; transition:.3s;}
#location-cont .sec01 .txtbox ul li .detail {margin-top:3.5rem;}
#location-cont .sec01 .txtbox ul li .detail dl {display:flex; font-size:1.7rem; color:#666; margin-top:1.5rem;}
#location-cont .sec01 .txtbox ul li .detail dl:first-child {margin-top:0;}
#location-cont .sec01 .txtbox ul li .detail dt {flex-shrink:0; font-weight:600; width:13rem; padding-right:2rem;}
#location-cont .sec01 .txtbox ul li .detail dt .ico {margin-right:1.5rem;}
#location-cont .sec01 .txtbox ul li.active h4 .arr {transform:rotate(180deg);} 
#location-cont .sec01 .txtbox ul li:not(.active) .detail {display: none;}
#location-cont .sec01 .mapbox {position:relative; width:73rem; height:90rem; flex-shrink:0;}
#location-cont .sec01 .mapbox > div {position:absolute; top:0; left:0; width:100%;}
#location-cont .sec01 .mapbox > div:not(.active) {opacity:0;}



/* [[  == DREAM 프랜차이즈 구축 실적 == ]] */
/* DREAM 프랜차이즈 구축 실적 */
#performance-cont .sec01 ul {display:flex; flex-wrap: wrap;}
#performance-cont .sec01 ul li {width:20%; height:15rem; display:flex; align-items:center; justify-content:center; position:relative; background:#fff; border:1px solid #e4e4e4; margin-left:-1px; margin-top: -1px;}
#performance-cont .sec01 ul li img {object-fit:contain; max-height:100%; padding:1.5rem;}
#performance-cont .sec01 ul li:after {display:block; content:''; width:0; height:0; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:transparent; opacity:0;}
#performance-cont .sec01 ul li:hover::after {width:100%; height:100%; border:0.8rem solid #ec3c47; opacity:1;}



/* [[  == DREAM 컨설팅 서비스 == ]] */
/* 서비스 안내 */
#service-info-cont .sec01 ul {display:flex; flex-wrap:wrap;}
#service-info-cont .sec01 ul li {width:calc(33.333% - 2.666rem); margin-right:4rem; margin-top:4rem; background:#fff; border:1px solid #f0f0f0; padding:6rem 5.5rem;position: relative;}
#service-info-cont .sec01 ul li:nth-child(3n) {margin-right:0;}
#service-info-cont .sec01 ul li:nth-child(-n+3) {margin-top:0;}
#service-info-cont .sec01 ul li .ico {width:16.3rem; height:16.3rem; display:flex; margin:0 auto; align-items:center; justify-content:center; border-radius:50%; background-color:#fdf7f7;}
#service-info-cont .sec01 ul li h4 {text-align:center; margin-top:3.5rem; font-size:2.3rem; font-weight:700;}
#service-info-cont .sec01 ul li .desc {font-size:1.7rem; color:#666; font-weight:500; line-height:1.647; margin-top:2rem;padding-bottom: 4rem;}
#service-info-cont .sec01 ul li .more-btn {color:#ec3c47; font-weight:600;position: absolute;bottom: 6rem;left: 5.5rem;}
#service-info-cont .sec01 ul li .more-btn .arr {width:1.5rem; height:0.8rem; margin-left:1rem; position:relative; display: inline-block;}
#service-info-cont .sec01 ul li .more-btn .arr .bar {position:absolute; display:inline-block; width:0.8rem; height:1px; background:#ec3c47;}
#service-info-cont .sec01 ul li .more-btn .arr .bar:nth-child(1) {transform:rotate(45deg); right:0; top:0.1rem;}
#service-info-cont .sec01 ul li .more-btn .arr .bar:nth-child(2) {transform:rotate(-45deg); right:0; bottom:0.1rem;}
#service-info-cont .sec01 ul li .more-btn .arr .bar:nth-child(3) {width:0; left:0; top:50%; transform:translateY(-50%); transition:all .4s ease;} 
#service-info-cont .sec01 ul li:hover {border-color:#ec3c47;}
#service-info-cont .sec01 ul li:hover .more-btn .arr .bar:nth-child(3) {width:calc(100% - 1px);}


/* 정보공개서 등록 / 가맹계약서 작성 -- 정보공개서 신규등록 */
#registration01-cont section {width:100%; overflow-x:hidden;}
#registration01-cont .sec01 {position:relative;}
#registration01-cont .sec01::after {display:block; content:''; width:100%; height:calc(100% - 14rem); position:absolute; top:50%; left:0; transform:translateY(-50%); background-color: #f7f7f7; z-index: -1;}
#registration01-cont .sec01 .row {position:relative;}
#registration01-cont .sec01 .row:nth-child(n+2) {margin-top:8rem;}
#registration01-cont .sec01 .row .inner {display:flex; align-items:center;}
#registration01-cont .sec01 .row .inner > * {width:50%; flex-shrink:0;}
#registration01-cont .sec01 .row:nth-child(even) .imgbox {position:absolute; top:0; right:0; text-align: right;}
#registration01-cont .sec01 .row:nth-child(even) .txtbox {padding-bottom:20rem;}
#registration01-cont .sec01 .txtbox {padding:10rem 12rem;}
#registration01-cont .sec01 .txtbox h4 {font-size:3.5rem; font-weight:700;}
#registration01-cont .sec01 .txtbox .desc {font-size:1.7rem; font-weight:500; color:#666666; line-height:1.7647; margin-top:2rem;}
#registration01-cont .sec01 .txtbox .desc strong {color:#303030;}
#registration01-cont .sec02 {padding-top:23rem; padding-bottom:16rem;}
#registration01-cont .sec02 ul {display:flex; flex-wrap:wrap;}
#registration01-cont .sec02 ul li {padding:4rem 3rem; min-height:29.9rem; background:#fafafa; border:2px solid #e1e1e1; margin-right:3.2rem; width:calc(25% - 2.4rem); position:relative; font-size:2rem; color:#444444; font-weight:600; line-height:1.65;}
#registration01-cont .sec02 ul li:nth-child(n+5) {margin-top:3.2rem;}
#registration01-cont .sec02 ul li:nth-child(4n) {margin-right:0;}
#registration01-cont .sec02 ul li p {margin-bottom:3rem;}
#registration01-cont .sec02 ul li .number {position:absolute; bottom:0; right:0; width:7.7rem; height:7rem; background:url(/images/sub/registration01-sec-title-deco.png) no-repeat center; font-size:2rem; color:#fff; font-weight:600; display: inline-flex; align-items: flex-end; justify-content: flex-end; padding: 0.8rem;}
#registration01-cont .sec03 {background:#f7f7f7; padding:16rem 0;}
#registration01-cont .sec03 .sec-title {margin-bottom:5rem;}
#registration01-cont .sec03 ul {display:flex; flex-wrap:wrap;}
#registration01-cont .sec03 ul li {background-color:#fff; width:calc(20% - 2.4rem); margin-right:3rem; text-align:center;}
#registration01-cont .sec03 ul li:nth-child(n+6) {margin-top:3rem;}
#registration01-cont .sec03 ul li:nth-child(5n) {margin-right:0;}


/* 정보공개서 등록 / 가맹계약서 작성 -- 정보공개서 변경등록 */
#registration02-cont .sec01 article:nth-of-type(n+2) {margin-top:7rem;}
#registration02-cont .sec01 article:nth-of-type(2) td {text-align:left; vertical-align: top;}


/* 정보공개서 등록 / 가맹계약서 작성 -- 가맹계약서 작성 */
#registration03-cont .sec01 .list-wrap {display:flex; border-top:2px solid #303030; border-bottom:1px solid #dddddd;}
#registration03-cont .sec01 .list {width:50%; flex-shrink:0; padding:4.5rem 6rem;}
#registration03-cont .sec01 .list li {display:flex; font-size:1.8rem; font-weight:500; color:#666; line-height:1.555; letter-spacing:-0.01em; margin-bottom:2.5rem;}
#registration03-cont .sec01 .list li .number {background-color:#c4c4c4; display:inline-flex; justify-content:center; align-items:center; width:2.8rem; height:2.8rem; color:#fff; font-weight:700; margin-right: 2rem; flex-shrink: 0;}
#registration03-cont .sec01 .aos-animate .list li .number {transition-duration: 1s;}
#registration03-cont .sec01 .aos-animate .list li .number.num01 {transition-delay:0.1s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num02 {transition-delay:0.2s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num03 {transition-delay:0.3s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num04 {transition-delay:0.4s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num05 {transition-delay:0.5s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num06 {transition-delay:0.6s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num07 {transition-delay:0.7s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num08 {transition-delay:0.8s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num09 {transition-delay:0.9s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num10 {transition-delay:1s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num11 {transition-delay:1.1s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num12 {transition-delay:1.2s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num13 {transition-delay:1.3s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num14 {transition-delay:1.4s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num15 {transition-delay:1.5s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num16 {transition-delay:1.6s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num17 {transition-delay:1.7s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num18 {transition-delay:1.8s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num19 {transition-delay:1.9s; background-color:#ec3c47;}
#registration03-cont .sec01 .aos-animate .list li .number.num20 {transition-delay:2s; background-color:#ec3c47;}
#registration03-cont .sec01 .bot-banner {padding:2rem; margin-top:4.5rem; text-align:center; color:#fff; background:#da3d49 url(/images/sub/registration03-bot-banner-bgdeco.png) no-repeat center bottom;}
#registration03-cont .sec01 .bot-banner .txtbox {border:1px solid rgba(255,255,255,0.3); padding:5rem 3%;}
#registration03-cont .sec01 .bot-banner h4 {font-size:2.8rem; font-weight:500; line-height:1.3214; letter-spacing: -0.01em;}
#registration03-cont .sec01 .bot-banner h4 strong {font-weight:700;}
#registration03-cont .sec01 .bot-banner p {margin-top:1.5rem; font-size:1.7rem; font-weight:500; line-height:1.529; letter-spacing: -0.01em;}


/* 홍보 / 마케팅 대행 */
#marketing-cont .flexbox {display:flex; align-items:center;}
#marketing-cont .flexbox.reverse {flex-direction:row-reverse;}
#marketing-cont .flexbox:not(.reverse) .imgbox {margin-right: 5rem;}
#marketing-cont .flexbox > * {width:50%;}
#marketing-cont .flexbox .imgbox {flex-shrink: 0;}
#marketing-cont .flexbox .txtbox {margin-left: 10rem;}
#marketing-cont .flexbox .txtbox h4 {font-size:3.5rem; font-weight:700;margin-top: 1rem;}
#marketing-cont .flexbox .txtbox .desc {font-size:2rem; font-weight:600; color:#666666; margin-top:1.5rem;}
#marketing-cont .flexbox .txtbox ul:before {display:inline-block; content:''; width:2.5rem; height:0.2rem; margin-top:5rem; margin-bottom:2.5rem;background-color: #bbbbbb;}
#marketing-cont .flexbox .txtbox ul li {position:relative; padding-left:2rem; font-size:1.8rem; color:#777; font-weight:500;}
#marketing-cont .flexbox .txtbox ul li::before {display:inline-block; content:''; width:8px; height:8px; background:url(/images/sub/ico-marketing-check.png) no-repeat center; position:absolute; top:1rem; left:0;}
#marketing-cont .flexbox .txtbox ul li strong {color:#303030; font-weight:600;}
#marketing-cont section {padding:12rem 0;}


/* 가맹점 인테리어 */
#interior-cont .imgbox {margin-bottom:6rem;}
#interior-cont .imgbox.ta-r {text-align:right;}
#interior-cont .imgbox.has-imgdeco {display:flex; align-items:flex-end;}
#interior-cont .imgbox.has-imgdeco .deco {display:inline-block; margin-left:5rem;}
#interior-cont .sec01 {padding-top:9rem; padding-bottom:16rem;}
#interior-cont .sec01:before {height:106rem;}
#interior-cont .sec01:after {display:block; content:''; width:100%; background-color:#f7f7f7; position:absolute; bottom:0; left:0; height:86.6rem; z-index:-1;}
#interior-cont article:last-child .imgbox:last-child {margin-bottom:0;}


/* 홈페이지 제작 */
#production-cont .flexbox {display:flex; justify-content:space-between;}
#production-cont .titlebox {flex-shrink:0; margin-right:10rem;}
#production-cont .titlebox .sec-title {margin-bottom:2.5rem; font-size:4rem;}
#production-cont .titlebox .desc {color:#666666; font-weight:500;}
#production-cont .logobox {display:flex; flex-wrap: wrap; width:100%; max-width:101rem;}
#production-cont .logobox li {width:25%; height:13.1rem; display:flex; align-items:center; justify-content:center; position:relative; background:#fff; border:1px solid #e4e4e4; margin-left:-1px; margin-top: -1px;}
#production-cont .logobox li img {max-height:100%; padding:1.5rem;}
#production-cont .logobox li:after {display:block; content:''; width:0; height:0; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:transparent; /*transition:.6s;*/ opacity:0;}
#production-cont .logobox li:hover::after {width:100%; height:100%; border:0.8rem solid #ec3c47; opacity:1;}


/* 기업강의 / 임직원 교육 */
#education-cont .imgbox {margin-bottom:5rem;}
#education-cont .imgbox:last-of-type {margin-bottom:0;}
#education-cont .imgbox.ta-r {text-align:right;}



@media ( max-width: 1600px ) {
    #company-cont .sec03 .imgbox {margin-right:8rem;}
}

@media ( max-width: 1200px ) {
    #company-cont .sec01 .step-arr {padding:1.5rem; flex-shrink: 0;}
    #company-cont .sec01 .step-list dl {width:15rem;}
    #company-cont .sec03 .imgbox {width:50%; margin-right:12rem;}
    #company-cont .sec03 {background-position: center left, bottom 4rem right 0; background-size: 42% auto, 45rem auto;}

    #ceo-cont .sec01 .txtbox .txt .pc-br {display:none;}

    #location-cont .sec01 .txtbox {margin-left:6rem;}

    #registration01-cont .sec01 .txtbox {padding:10rem;}
    #registration01-cont .sec01 .txtbox .pc-br {display:none;}
    #registration01-cont .sec02 {padding:16rem 0;}
}


@media ( max-width: 1024px ) {
    #company-cont .sec01 .step-arr {padding:2rem;}
    #company-cont .sec01 .step-list dd {font-size:2rem;}
    #company-cont .sec01 .graff {flex-direction:column;}
    #company-cont .sec01 .graff .arrow {transform: rotate(90deg); padding: 2rem;}
    #company-cont .sec01 .graff .mna {width:15rem; height:15rem; font-size:3rem; margin-top: 2rem;}
    #company-cont .sec01 .graff .mna::before {background-size: 12rem; background-position: center bottom 1rem;}
    #company-cont .sec03 {flex-direction:column; background-image:url(/images/sub/company-sec03-bgdeco02.png); background-position:bottom 8rem right 0; background-size: 30rem auto;}
    #company-cont .sec03 > * {width:95%;}
    #company-cont .sec03 .txtbox {padding-right:0;}
    #company-cont .sec03 .txtbox p .pc-br {display:none;}
    #company-cont .sec03 .imgbox {width:100%; margin-right:0; margin-bottom:8rem;}

    #ceo-cont .sec01 .txtbox h3 .pc-br {display:none;}

    #philosophy-cont .sec01 ul li {padding:3.5rem;}
    #philosophy-cont .sec01 ul li .ico {margin-left:4rem;}
    #philosophy-cont .sec01 ul li .txtbox {margin-left:4rem;}

    #registration01-cont .sec01::after {height:100%;}
    #registration01-cont .sec01 .txtbox {padding:8rem 6rem;}
    #registration01-cont .sec01 .txtbox h4 {font-size:3rem;}
    #registration01-cont .sec01 .row:nth-child(n+2) {margin-top:6rem;}
    #registration01-cont .sec01 .row:nth-child(even) .txtbox {padding-top:0rem; padding-bottom:6rem; padding-left:0;}
    #registration01-cont .sec02 ul li {width: calc(50% - 2.4rem);}
    #registration01-cont .sec02 ul li:nth-child(2n) {margin-right:0;}
    #registration01-cont .sec02 ul li:nth-child(n+3) {margin-top:3.2rem;}    
    #registration02-cont .sub-title .desc .pc-br {display:none;}
    #registration03-cont .sec01 .list {padding:4rem;}

    #production-cont .flexbox {flex-direction:column;}
    #production-cont .titlebox {margin-right:0; margin-bottom:4rem;}
    
	#interior-cont .imgbox.has-imgdeco {flex-direction:column-reverse; align-items:flex-start;}
	#interior-cont .imgbox.has-imgdeco .deco {transform:rotate(-90deg); transform-origin:right; margin-top:-10rem; margin-left:0; margin-bottom:1rem; width:8rem;}

    #marketing-cont .flexbox .txtbox {margin-left:6rem;}
    #marketing-cont .sec02 .flexbox .txtbox {margin-left:0;}

    #location-cont .sec01 .mapbox {width:50%;}
    #location-cont .sec01 .txtbox {width:50%;}    
}

@media ( max-width: 768px ) {
    .sub-toparea {padding-top:6rem;}
    .sub-toparea .page-depth01 {font-size:3rem; margin-bottom:2.5rem;}
    .sub-toparea .page-location {margin-top:0;}
    .sub-toparea .page-location ul li.mb-none {display:none;}
    .sub-toparea .svisual {height:26rem; margin-top:6rem;}
    .sub-toparea .svisual.bg-none {margin-top:3rem;}

    .sec-title {font-size:2.4rem;}
    .sub-title .inner {padding:8rem 0;}
    .sub-title small {font-size:1.5rem;}
    .sub-title h3 {font-size:2.8rem; line-height:1.35; margin-top:1rem;}
    .sub-title .desc {font-size:1.6rem;}
    .sub-title .desc .pc-br {display:none;}

    .sub-tab {height:8rem;}
    .sub-tab a {font-size:1.6rem; margin:0 0.5rem;}
    .sub-tab.fixed {height:6rem;}
    .sub-tab.fixed a {font-size:1.6rem;}

    .tb-style01 th {font-size:1.6rem; padding:1.5rem;}
    .tb-style01 td {font-size:1.6rem; padding:2rem;}

    .has-bgdeco {padding-top:8rem; padding-bottom:8rem;}
    .has-bgdeco .bg-txt {font-size:5rem; top:-3.5rem;}

    .has-bgimg {padding-bottom:8rem;}

    #company-cont .sec-tit {font-size:2.6rem; margin-bottom:5rem; width:80%;}
    #company-cont .sec-tit span .num {font-size:4.5rem;}
    #company-cont .sec01 {padding:8rem 0;}
    #company-cont .sec01 .step-list {flex-direction:column;}
    #company-cont .sec01 .step-list .step-arr {transform: rotate(90deg);} 
    #company-cont .sec01 .step-list dl {width:100%; height:inherit; padding:3rem 2rem; text-align: center;}
    #company-cont .sec01 .step-list dd {font-size:2rem;}
    #company-cont .sec01 .step-list dd br {display:none;}
    #company-cont .sec02 {padding:8rem 0;}
    #company-cont .sec02 .sec-tit {margin-bottom:0;}
    #company-cont .sec02 ul li {width:50%; margin-top:5rem;}
    #company-cont .sec02 ul li dt {font-size:1.6rem;}
    #company-cont .sec02 ul li dd {font-size:1.6rem;}
    #company-cont .sec02 ul li dd .num {font-size:3rem;}
    #company-cont .sec03 {padding:8rem 0; flex-direction:column;}
    #company-cont .sec03 .imgbox {margin-right:0; margin-bottom:6rem;}
    #company-cont .sec03 .sec-tit {margin-bottom:2.5rem;}
    #company-cont .sec03 .txtbox {width: 94%; margin-left:auto; margin-right:auto;}
    #company-cont .sec03 .txtbox p {font-size:1.6rem;}
    #company-cont .sec03 .txtbox p .pc-br {display:none;}
    
    #ceo-cont .sec01 {padding:8rem 0 0;}
    #ceo-cont .sec01::after {bottom:auto; top:0; width:80%; height:20rem;}
    #ceo-cont .sec01 .inner {flex-direction:column;}
	#ceo-cont .sec01 .inner::after {left:40%;}
    #ceo-cont .sec01 .inner > * {width:100%;}
    #ceo-cont .sec01 .txtbox {padding-left:0;}
    #ceo-cont .sec01 .txtbox .txt .pc-br {display:none;}
    #ceo-cont .sec01 .txtbox small {font-size:1.6rem;}
    #ceo-cont .sec01 .txtbox h3 {font-size:2.6rem; margin-top:1.5rem;}
	#ceo-cont .sec01 .txtbox h3:before {top:-4rem; left:-2%;}
    #ceo-cont .sec01 .txtbox .txt {font-size:1.6rem;}
    #ceo-cont .sec01 .txtbox .txt:before {width:5rem; height:0.2rem; margin:3rem 0;}
    #ceo-cont .sec01 .txtbox .name {margin-top:3rem;}
    #ceo-cont .sec01 .txtbox .name dt {font-size:1.6rem;}
    #ceo-cont .sec01 .txtbox .name dd {font-size:2rem;}
    #ceo-cont .sec02 {padding:8rem 0; background-size:22rem auto;}
    #ceo-cont .sec02 h3 {font-size:2.6rem; margin-bottom:2rem;}
    #ceo-cont .sec02 .inner {flex-direction:column;}
    #ceo-cont .sec02 .cont {flex-direction:column;}
    #ceo-cont .sec02 .cont ul {width:100%; margin-top:2rem;}
    #ceo-cont .sec02 .cont ul li {font-size:1.6rem;}

    #philosophy-cont .sec01 ul li {flex-direction:column;}
    #philosophy-cont .sec01 ul li .ico {order:-1; margin:auto; width: 12rem; height: 12rem; padding: 3.5rem;}
    #philosophy-cont .sec01 ul li .number {margin-top:1.5rem;}
    #philosophy-cont .sec01 ul li .txtbox {margin-left:0;}
    #philosophy-cont .sec01 ul li .txtbox dt {font-size:2.2rem;}

    #location-cont .sec01 {padding-top:8rem; padding-bottom:8rem;}
    #location-cont .sec01 article {flex-direction:column;}
    #location-cont .sec01 .mapbox {width:100%; height:40rem;}
    #location-cont .sec01 .txtbox {width:100%; margin-top:6rem; margin-left:0;}
    #location-cont .sec01 .txtbox ul li {padding:3rem 0;}
    #location-cont .sec01 .txtbox ul li h4 {font-size:2.2rem;}
    #location-cont .sec01 .txtbox ul li h4 .arr {width:2rem;}
    #location-cont .sec01 .txtbox ul li .detail {margin-top:2rem;}
    #location-cont .sec01 .root_daum_roughmap .wrap_map {height:40rem;}

    #performance-cont .sec01 ul li {width:33.333%;}
    #performance-cont .sec01 ul li:hover::after {border-width:0.3rem;}

    #service-info-cont .sec01 ul li {width:100%; margin-right:0; margin-top:2rem; padding:3rem; text-align: center;}
    #service-info-cont .sec01 ul li:nth-child(-n+3){margin-top:2rem;}
    #service-info-cont .sec01 ul li:first-child {margin-top:0;}
    #service-info-cont .sec01 ul li h4 {font-size:2rem;}
    #service-info-cont .sec01 ul li .ico {width:11rem; height:11rem; padding:3rem;}
    #service-info-cont .sec01 ul li .desc {font-size:1.6rem; padding-bottom:2rem;}
    #service-info-cont .sec01 ul li .more-btn {display:inline-block; position: inherit; bottom:inherit; left:inherit;}

    #registration01-cont .sec01::after {display:none;}
    #registration01-cont .sec01 .row:nth-child(n+2) {margin-top:3rem;}
    #registration01-cont .sec01 .row .inner {flex-direction:column;}
    #registration01-cont .sec01 .row .inner > * {width:100%;}
    #registration01-cont .sec01 .row:nth-child(even) .imgbox {position: inherit; top:inherit; right:inherit;}
    #registration01-cont .sec01 .row:nth-child(even) .txtbox {padding-top:6rem; padding-bottom:0;}
    #registration01-cont .sec01 .txtbox {padding:5rem 0;}
    #registration01-cont .sec01 .txtbox h4 {font-size:2.4rem;}
    #registration01-cont .sec01 .txtbox .desc {font-size:1.6rem;}
    #registration01-cont .sec01 .txtbox .pc-br {display:none;}
    #registration01-cont .sec02 {padding:8rem 0;}
    #registration01-cont .sec02 ul li {width:100%; margin-right:0; min-height:inherit; font-size:1.6rem; padding:2rem}
    #registration01-cont .sec02 ul li:nth-child(n+2) {margin-top:2rem;}
    #registration01-cont .sec02 ul li:nth-child(n+5) {margin-top:2rem;}
    #registration01-cont .sec02 ul li p {margin-bottom:0;}
    #registration01-cont .sec02 ul li p .pc-br {display:none;}
    #registration01-cont .sec02 ul li .number {width: 5rem;height: 5rem;padding: 0.3rem;font-size: 1.6rem;}
    #registration01-cont .sec03 {padding:8rem 0;}
    #registration01-cont .sec03 ul li {width:calc(50% - 1rem); margin-right:2rem;}
    #registration01-cont .sec03 ul li:nth-child(5n) {margin-right:2rem;}
    #registration01-cont .sec03 ul li:nth-child(2n) {margin-right:0;}
    #registration01-cont .sec03 ul li:nth-child(n+6) {margin-top:2rem;}
    #registration01-cont .sec03 ul li:nth-child(n+3) {margin-top:2rem;}

    #registration03-cont .sec01 .list-wrap {flex-direction:column;}
    #registration03-cont .sec01 .list {width:100%; padding:4rem 0;}
    #registration03-cont .sec01 .list:first-child {padding-bottom:0;}
    #registration03-cont .sec01 .list:last-child {padding-top:0;}
    #registration03-cont .sec01 .list li {font-size:1.6rem; margin-bottom:2rem;}
    #registration03-cont .sec01 .list .pc-br {display:none;}
    #registration03-cont .sec01 .bot-banner h4 {font-size:2.2rem;}
    #registration03-cont .sec01 .bot-banner p {font-size:1.6rem;}
    #registration03-cont .sec01 .bot-banner br {display:none;}

    #marketing-cont section {padding:8rem 0;}
    #marketing-cont .flexbox {flex-direction:column;}
    #marketing-cont .flexbox.reverse {flex-direction:column;}
    #marketing-cont .flexbox > * {width:100%;}
    #marketing-cont .flexbox .imgbox {order:1;}
    #marketing-cont .flexbox .txtbox {order:2; margin-left:0; margin-top:4rem; text-align:center;}
    #marketing-cont .flexbox .txtbox h4 {font-size:2.2rem;}
    #marketing-cont .flexbox .txtbox .desc {font-size:1.8rem;}
    #marketing-cont .flexbox .txtbox ul {display:flex; flex-direction:column; justify-content:center; align-items: center;}
    #marketing-cont .flexbox .txtbox ul li {display:inline-block; width:auto;}
    #marketing-cont .flexbox:not(.reverse) .imgbox {margin-right:0;}
	
	#interior-cont .sec01 {padding-top:8rem; padding-bottom:8rem;}
	#interior-cont .imgbox {margin-bottom:4rem;}

    #production-cont .titlebox .sec-title {font-size:2.4rem;}
    #production-cont .logobox li {width:33.333%;}
    #production-cont .logobox li:hover::after {display:none;}
}