/* 여기에 작업 또는 수정할 당신의 css style을 설정하세요. (customizations) */ #topcontrol {z-index:999;} #topcontrol > .eb-top {background: rgba(238, 119, 0, 0.8)!important;} /************************************************* 브랜드이야기 - 인사말 ********************************************************/ .pcVer {display:block;} .mobVer {display:none;} .greetings_wp {max-width:100%; margin:50px 0 100px;} .greetings_wp .contents_wp {} .greetings_wp .contents_wp .title {text-align:center;} .greetings_wp .contents_wp .title .title_img {max-width:520px; margin:0 auto;} .greetings_wp .contents_wp .title .title_img img {width:100%;} .greetings_wp .contents_wp .title p {} .greetings_wp .contents_wp .title .title_txt01 {margin:20px 0 0 0; color:#343434; font-size:25px; font-weight:bold; } .greetings_wp .contents_wp .title .title_txt02 {color:#ff7e00; font-size:17px; font-weight:500; } .greetings_wp .contents_wp .content {margin:30px auto 0; max-width:1190px; position:relative; text-align: center;} .greetings_wp .contents_wp .content .cont_img {max-width:370px;} .greetings_wp .contents_wp .content .cont_img img {width:100%;} .greetings_wp .contents_wp .content .cont_img img.rightImg {position:absolute; max-width:270px; bottom:0; right:0; } .greetings_wp .contents_wp .content .signImg img {position:absolute; bottom:3%; left:33%;} .greetings_wp .contents_wp .content .signImg img.rightImg {position:absolute; bottom:3%; right:23%; left:inherit;} .greetings_wp .contents_wp .content .mobVer {display:none!important;} /* .greetings_wp .contents_wp .content .cont_txt {max-width:758px; top:50px; left:285px; position:absolute; display:inline-block; padding:95px 100px; } */ .greetings_wp .contents_wp .content .cont_txt {max-width:758px; top:90px; left:290px; position:absolute; display:inline-block; padding:95px 100px; } .draw_border {background:none; display:block; width:714px; height:315px; position:absolute; top:0; left:0; visibility:hidden;} .borderLeft,.borderTop,.borderRight,.borderBottom { position:absolute; background:transparent; width:0px; height:0px; background-color:#f5f5f5;} .borderLeft {left:0; bottom:0; height:315px; width:7px;} .borderTop {top:0; left:0; width:714px; height:7px;} .borderRight {right:0; top:0; height:315px; width:7px;} .borderBottom {bottom:0; right:0; width:714px; height:7px;} .greetings_wp .contents_wp .content .cont_txt p {font-size:14.5px; color:#585858; font-weight:600; line-height:2} @media all and (max-width: 1200px) { .pcVer {display:none;} .mobVer {display:block;} .greetings_wp .contents_wp .content .ceoContent {display:inline-block; width:45%; margin: 0 auto} /*.greetings_wp .contents_wp .content .ceoContent.fr {float:right;}*/ .greetings_wp .contents_wp .content .ceoContent img {display:block; text-align:center; margin:0 auto; max-width:100%;} .greetings_wp .contents_wp .content .ceoContent:after {content:''; clear:both; display:block;} .greetings_wp .contents_wp .content .cont_txt {position:relative; top:inherit; left:inherit; display:block; margin:5% auto 0; padding:0;} .greetings_wp .contents_wp .content .pcBorder {display:none!important;} .greetings_wp .contents_wp .content .mobileBorder {border:7px solid #f5f5f5; display:block!important; position:relative; width:inherit; height:inherit; padding:48px; left:0px; margin: 0 auto; } } /************************************************* 브랜드이야기 - 인사말 ********************************************************/ /************************************************* 브랜드이야기 - 회사소개 ********************************************************/ .pcView {display:block;} .mobileView {display:none;} .aboutus_wp {max-width:100%; margin:50px 0 100px;} .aboutus_wp .contents_wp {} .aboutus_wp .contents_wp .title {text-align:center;} .aboutus_wp .contents_wp .title .title_txt01 {color:#2e2e2e; font-size:33px; line-height:1.3;} .aboutus_wp .contents_wp .title .title_txt01 span {position:relative; font-weight:bold;} .aboutus_wp .contents_wp .title .title_txt01 span:after{content:""; position:absolute; left:0; bottom:0; top:17px; right:20px; margin:auto; background:#ff8a00; height:8px; z-index:-1; width:93%; } .aboutus_wp .contents_wp .title .title_txt02 {color:#909090; font-size:16px; font-weight:400; line-height:1.8; } .aboutus_wp .contents_wp .contents {position:relative; max-width:1245px; height:1550px; margin:50px 0 0 0;} .aboutus_wp .contents_wp .contents .section_txt .section_title_txt {margin:0 0 20px 0; font-size:25px; line-height:1.5; color:#303030; font-weight:600;} .aboutus_wp .contents_wp .contents .section_txt .section_sub_txt { letter-spacing:0.4px; font-size:15px; line-height:1.8; color:#818181; font-weight:400; } .aboutus_wp .contents_wp .title .title_txt03 {color:#4c4c4c; font-size:16px; font-weight:400;} .aboutus_wp .contents_wp .contents .num01_section .cont_img {position:absolute; left:3%; top:0; z-index:2;} .aboutus_wp .contents_wp .contents .num01_section .num_img {position:absolute; z-index:1; left:43%; top:3%;} .aboutus_wp .contents_wp .contents .num01_section .section_txt {position:relative; top:181px; left:52.8%; z-index:3; } .aboutus_wp .contents_wp .contents .num02_section .cont_img {position:absolute; left:53%; top:27.5%; z-index:1;} .aboutus_wp .contents_wp .contents .num02_section .num_img {position:absolute; left:54%; top:47%; z-index:2;} .aboutus_wp .contents_wp .contents .num02_section .section_txt {position:relative; top:780px; left:54.5%; } .aboutus_wp .contents_wp .contents .num03_section .cont_img {position:absolute; left:0%; top:46.5%; z-index:1;} .aboutus_wp .contents_wp .contents .num03_section .num_img {position:absolute; left:3%; top:82%; z-index:2;} .aboutus_wp .contents_wp .contents .num03_section .section_txt {position:relative; top:1036px; left:28%; } @media all and (max-width: 1200px) { .aboutus_wp {max-width:100%; margin:50px 0 0;} .aboutus_wp .contents_wp .contents {height:auto;} .aboutus_wp .contents_wp .contents .num01_section, .aboutus_wp .contents_wp .contents .num02_section, .aboutus_wp .contents_wp .contents .num03_section {text-align:center; margin-bottom:70px;} .aboutus_wp .contents_wp .contents .num01_section .cont_img, .aboutus_wp .contents_wp .contents .num01_section .num_img, .aboutus_wp .contents_wp .contents .num01_section .section_txt, .aboutus_wp .contents_wp .contents .num02_section .cont_img, .aboutus_wp .contents_wp .contents .num02_section .num_img, .aboutus_wp .contents_wp .contents .num02_section .section_txt, .aboutus_wp .contents_wp .contents .num03_section .cont_img, .aboutus_wp .contents_wp .contents .num03_section .num_img, .aboutus_wp .contents_wp .contents .num03_section .section_txt {position:relative; top:0; left:0%; margin:20px 0;} .aboutus_wp .contents_wp .contents .num01_section .num_img img, .aboutus_wp .contents_wp .contents .num02_section .num_img img, .aboutus_wp .contents_wp .contents .num03_section .num_img img {width:100%; max-width:112px;} .aboutus_wp .contents_wp .contents .num01_section .cont_img img, .aboutus_wp .contents_wp .contents .num02_section .cont_img img, .aboutus_wp .contents_wp .contents .num03_section .cont_img img {width:100%;} } @media all and (max-width: 768px) { .pcView {display:none} .mobileView {display:block} } /************************************************* 브랜드이야기 - 회사소개 ********************************************************/ @media all and (max-width: 768px) { .aboutus_wp .contents_wp .title .title_txt01 {color:#2e2e2e; font-size:23px; line-height:1.3;} .aboutus_wp .contents_wp .title .title_txt02 {color:#909090; font-size:14px; font-weight:300; line-height:1.8;} } /************************************************* 브랜드이야기 - BI소개 ********************************************************/ .bi_wp {max-width:100%; margin:10px 0 100px;} .bi_wp .contents_wp {max-width:1186px; margin:0 auto;} .bi_wp .contents_wp .top_banner {margin-bottom:2%;} .bi_wp .contents_wp .top_banner .pcBanner {max-width:1186px; display:block;} .bi_wp .contents_wp .top_banner .pcBanner img {width:100%;} .bi_wp .contents_wp .top_banner .mobileBanner {display:none;} .bi_wp .contents_wp .contents {max-width:100%; border-bottom:1px solid #a8a8a8; padding:0 0 45px 0} .bi_wp .contents_wp .contents:after {clear:both; display:block; content:'';} .bi_wp .contents_wp .contents .title {width:281px; text-align:center; float:left; padding:45px 0 0 0; border-top:1px solid #ff9c00; } .bi_wp .contents_wp .contents .content {width:905px; border-top:1px solid #a8a8a8; float:left; padding:45px 0 0 0;} .bi_wp .contents_wp .contents .pcLogo {display:block;} .bi_wp .contents_wp .contents .mobileLogo {display:none;} .bi_wp .contents_wp .contents .content .pcTitleTxt {padding:0 0 0 50px; font-weight:400; color:#202020; font-size:18px;} .bi_wp .contents_wp .contents .content .pcTitleTxt > span {font-weight:900; position:relative;} .bi_wp .contents_wp .contents .content .pcTitleTxt > span:after{content:""; position:absolute; top:11px; left:0; bottom:0px; right:16px; margin:auto; background:#ff8a00; height:7px; z-index:-1; width:98%; } .bi_wp .contents_wp .contents .content .mobileTitleTxt {display:none;} .bi_wp .contents_wp .contents .content .pcContTxt {padding:0 0 45px 50px; font-weight:400; color:#646464; font-size:14px; line-height:2;} .bi_wp .contents_wp .contents .content .mobileContTxt {display:none;} .bi_wp .contents_wp .contents .content .pcContImg {display:block; text-align:right; } .bi_wp .contents_wp .contents .content .pcContImg img {max-width:100%;} .bi_wp .contents_wp .contents .content .mobileContImg {display:none;} @media all and (max-width: 1200px) { .bi_wp .contents_wp .contents {text-align:center;} .bi_wp .contents_wp .contents .title {width:100%;} .bi_wp .contents_wp .contents .content {border-top:none; width:100%;} .bi_wp .contents_wp .contents .pcLogo {display:none;} .bi_wp .contents_wp .contents .mobileLogo {display:block;} .bi_wp .contents_wp .contents .content .pcTitleTxt {padding:0;} .bi_wp .contents_wp .contents .content .pcContTxt {padding:0 0 45px 0;} } @media all and (max-width: 768px) { .bi_wp .contents_wp .top_banner .pcBanner {display:none;} .bi_wp .contents_wp .top_banner .mobileBanner {max-width:640px; margin:0 auto; display:block;} .bi_wp .contents_wp .top_banner .mobileBanner img {width:100%;} .bi_wp .contents_wp .contents .content {padding:25px 0 0 0; } .bi_wp .contents_wp .contents .content .pcContImg {display:none;} .bi_wp .contents_wp .contents .content .mobileContImg {padding-top:18px; width:100%; display:block;} .bi_wp .contents_wp .contents .content .mobileContImg img {width:100%;} .bi_wp .contents_wp .contents .content .pcTitleTxt {display:none;} .bi_wp .contents_wp .contents .content .mobileTitleTxt {display:block; padding:0px; font-weight:400; color:#202020; font-size:18px;} .bi_wp .contents_wp .contents .content .mobileTitleTxt > span {font-weight:900; position:relative;} .bi_wp .contents_wp .contents .content .mobileTitleTxt > span:after{content:""; position:absolute; left:0; bottom:0px; right:16px; margin:auto; background:#ff8a00; height:7px; z-index:-1; width:98%; } .bi_wp .contents_wp .contents .content .pcContTxt {display:none;} .bi_wp .contents_wp .contents .content .mobileContTxt {padding-top:15px; display:block; font-weight:400; color:#646464; font-size:14px; line-height:2; } } /************************************************* 브랜드이야기 - BI소개 ********************************************************/ /************************************************* 브랜드이야기 - 연혁 ********************************************************/ .history {} .history .contents_wp { position:relative; max-width:1245px; margin:0 auto; background:url('./img/history/history_bg.jpg') no-repeat; display:inline-block; background-position:50% 0; padding-top:60px;} .history .contents_wp:after {clear:both; content:''; background:#ee7700; width:1px; height:1850px; text-align:center; display:inline-block; position:absolute; left:50%;} .history .contents_wp .history_cont {width:50%; position:relative;} .history .contents_wp .history_cont .yearDot {width:6px; height:6px; background:#ee7700; position:absolute; border-radius:50px!important;} .history .contents_wp .history_cont .dotRight {right:-3px; top:18px;} .history .contents_wp .history_cont .dotLeft {left:-3px; top:18px;} .history .contents_wp .history_cont:after {clear:both; content:''; display:block;} .history .contents_wp .history_cont p {margin:0;} .history .contents_wp .history_cont .history_title {font-size:27px; color:#ee7700; font-weight:500; margin-bottom:10px;} .history .contents_wp .history_cont .history_sub {font-size:14px; color:#3d3d3d; font-weight:500; line-height:1.9;} .history .contents_wp .leftSide {text-align:right; float:left;} .history .contents_wp .leftSide .history_title:after {clear:both; content:''; background:#ee7700; width:38px; height:1px; float:right; margin-top:20px; margin-left:12px;} .history .contents_wp .leftSide .history_sub {padding-right:50px;} .history .contents_wp .leftSide .history_sub:after {clear:both; content:''; background:#000; width:5px; height:1px; float:right; margin-top:10px; margin-left:5px;} .history .contents_wp .leftSide .history_sub.afterNone::after {background:transparent;} .history .contents_wp .leftSide .imgs {margin-right:50px; margin-top:20px; margin-bottom:55px;} .history .contents_wp .rightSide {text-align:left; float:right;} .history .contents_wp .rightSide .imgs {margin-left:45px; margin-top:20px;} .history .contents_wp .rightSide .imgs span {margin:0 5px;} .history .contents_wp .rightSide .history_title:after {clear:both; content:''; background:#ee7700; width:38px; height:1px; float:left; margin-top:20px; margin-right:12px;} .history .contents_wp .rightSide .history_sub {padding-left:50px;} .history .contents_wp .rightSide .history_sub:after {clear:both; content:''; background:#000; width:5px; height:1px; float:left; margin-top:10px; margin-right:5px;} @media all and (max-width: 1200px) { .history .contents_wp:after {height:1440px;} .history .contents_wp .rightSide .imgs {margin-top:10px;} .history .contents_wp .rightSide .imgs span {margin:5px 0; display:inline-block;} .mt347 {margin-top:525px!important;} .mt116 {margin-top:145px!important;} .mt73 {margin-top:170px!important;} } @media all and (max-width: 768px) { .history .contents_wp {background-position:-17px 0;} .history .contents_wp:after {left:0%; margin-left:53px;} .history .contents_wp .leftSide {text-align:left;} .history .contents_wp .history_cont {width:100%;} .history .contents_wp .history_cont .dotRight {left:-3px;} .history .contents_wp .leftSide .history_title:after {float:left; margin-right:12px; margin-left:2px;} .history .contents_wp .leftSide .history_sub:after {float:left; margin-right:5px; margin-left:2px;} .history .contents_wp .leftSide .history_sub {padding-left:79px; padding-right:0;} .history .contents_wp .rightSide .history_sub {padding-left:79px; padding-right:0;} .history .contents_wp .history_cont .history_title {padding-left:50px;} .history .contents_wp .history_cont .dotLeft {left:51px;} .history .contents_wp .history_cont .dotRight {left:51px;} .history .contents_wp .rightSide .imgs {width:230px; margin-left:80px;} .history .contents_wp .rightSide .imgs img {width:100%;} .history .contents_wp .leftSide .imgs {width:230px; margin-left:80px;} .history .contents_wp .leftSide .imgs img {width:100%;} .mt166, .mt151, .mt133, .mt347, .mt116, .mt73, .mt140 {margin-top:40px!important;} .history .contents_wp .rightSide.mb50 {margin-bottom:0 !important;} } p, td, li, dd, dt, .block, th {word-break:keep-all; word-wrap:break-word;} /************************************************* 브랜드이야기 - 연혁 ********************************************************/ /************************************************* 브랜드이야기 - 수상내역 ********************************************************/ .award .flexBox {max-width:1100px; margin:40px auto 80px;} .award .flexBox ul {display:flex; flex-direction: row; flex-wrap: wrap; align-items: flex-start; text-align:center; padding:0;} .award .flexBox ul li {width:calc(100% / 3); margin-bottom:40px;} .award .flexBox ul li:nth-last-child(-n+3) {margin-bottom:0;} .award .flexBox ul li figure {margin:0 0 15px;} .award .flexBox ul li p {font-size:15px; color:#3d3d3d;} @media all and (max-width: 1024px) { .award .flexBox {margin:30px 0 60px;} .award .flexBox ul li {width:calc(100% / 3); margin-bottom:30px;} .award .flexBox ul li:nth-last-child(-n+3) {margin-bottom:0;} .award .flexBox ul li figure {margin:0 0 12px;} .award .flexBox ul li figure img {width:auto; height:100px;} .award .flexBox ul li p {font-size:14px; color:#3d3d3d;} } @media all and (max-width: 768px) { .award .flexBox {margin:30px 0 45px;} .award .flexBox ul li {width:calc(100% / 2); margin-bottom:26px;} .award .flexBox ul li:nth-last-child(-n+3) {margin-bottom:26px;} .award .flexBox ul li:nth-last-child(-n+2) {margin-bottom:0;} .award .flexBox ul li figure {margin:0 0 8px;} .award .flexBox ul li figure img {width:auto; height:20vw; max-height:100px;} .award .flexBox ul li p {font-size:13px;} } /************************************************ 브랜드이야기 - 수상내역 ********************************************************/ /************************************************ 브랜드이야기 - 사회공헌활동 ********************************************************/ .social_wp .contents .contentImg:after {clear:both; display:block; content:'';} .social_wp .contents .contentImg ul li {float:left; width:49%; text-align:center; margin:0 0.5% 1%;} .social_wp .contents .contentImg ul li:nth-last-child(-n+2) {margin-bottom:0;} .social_wp .contents .contentImg ul li img {width:100%;} .social_wp .contents .contentTxt p {color:#484848; font-size:15px; margin:1% 0 5%; padding-left:5%; } @media all and (max-width: 1200px) { .social_wp .contents .contentImg ul {padding:0; margin:0;} .social_wp .contents .contentImg ul li {float:unset; width:99%; margin:3% 0.5%;} .social_wp .contents .contentTxt p {padding-left:0;} } /************************************************* 브랜드이야기 - 사회공헌활동 ********************************************************/ /************************************************* 메뉴안내 ********************************************************/ .pcView {display:block;} .mobileView {display:none;} /***********************************************Sushi-roll********************************************************/ .menuInfo_wp {max-width:100%; margin:50px 0 100px;} .menuInfo_wp .contents_wp:after {clear:both; display:block; content:'';} .menuInfo_wp .contents_wp .title {text-align:center;} .menuInfo_wp .contents_wp .title .title_txt01 {position:relative; z-index:5; color:#2e2e2e; font-size:33px; line-height:1.3;} .menuInfo_wp .contents_wp .title .title_txt01 span {position:relative; font-weight:bold; z-index:1;} .menuInfo_wp .contents_wp .title .title_txt01 span:after{content:""; position:absolute; left:0; bottom:0; top:22px; right:20px; margin:auto; background:#ff8a00; height:8px; z-index:-1; width:93%; } .menuInfo_wp .contents_wp .title .title_txt03 {position:relative; z-index:5; color:#4c4c4c; font-size:16px; font-weight:400;} .menuInfo_wp .contents_wp .contents {position:relative; max-width:1185px; margin:50px auto;} .menuInfo_wp .contents_wp .contents .icon_wp {position:relative; z-index:5; max-width:760px; margin:5% auto;} .menuInfo_wp .contents_wp .contents .icon_wp:after {clear:both; display:block; content:'';} .menuInfo_wp .contents_wp .contents .icon_wp ul {} .menuInfo_wp .contents_wp .contents .icon_wp ul li {float:left; width:33%; text-align:center;} .menuInfo_wp .contents_wp .contents .icon_wp ul li p {display:inline-block; font-size:15px; color:#676767; margin-top:15px; } .menuInfo_wp .contents_wp .contents .content_wp {margin-top:3%;} .menuInfo_wp .contents_wp .contents .content_wp .content {position:relative; float:left; width:48%; margin:0 1%;} .menuInfo_wp .contents_wp .contents .content_wp .content:after {clear:both; display:block; content:''; } .menuInfo_wp .contents_wp .contents .content_wp .content .content_bg {} .menuInfo_wp .contents_wp .contents .content_wp .content .content_bg img {width:100%;} .menuInfo_wp .contents_wp .contents .content_wp .content .content_bg .white_layer {position:absolute; background:#fff; width:100%; height:27%; top:-27%; z-index:2;} .menuInfo_wp .contents_wp .contents .content_wp .content .layer {position:absolute; background:rgba(240,115,4,0.8); top:74%; bottom:0; left:0; right:0; overflow:hidden; transition: all 1s;} .menuInfo_wp .contents_wp .contents .content_wp .content:hover .layer {top:-27%;} .menuInfo_wp .contents_wp .contents .content_wp .content .layer .layer_wp {max-width:255px; margin:0 auto; padding:3% 0;} .menuInfo_wp .contents_wp .contents .content_wp .content:nth-child(2) .layer .layer_wp {max-width:247px; margin:0 auto; padding:3% 0;} .menuInfo_wp .contents_wp .contents .content_wp .content:nth-child(3) .layer .layer_wp {max-width:340px; margin:0 auto; padding:3% 0;} .menuInfo_wp .contents_wp .contents .content_wp .content .layer .layer_wp p {margin:0; color:#fff; font-size:15px; text-align:center;} .menuInfo_wp .contents_wp .contents .content_wp .content .layer .layer_wp p.title {font-weight:bold; font-size:16px; line-height:2; } .menuInfo_wp .contents_wp .contents .content_wp .content .layer .layer_wp p.sentence {font-size:14px;} .menuInfo_wp .contents_wp .contents .content_wp .content .layer .layer_wp p.sentence.over {line-height:2; margin-top:55%; } .menuInfo_wp .contents_wp .contents .content_wp .content:nth-child(3) .layer .layer_wp p.sentence.over {line-height:2; margin-top:25%; } /******************************************** Hotdish ***********************************************************/ .menuInfo_wp .contents_wp .contents.hotdish .content_wp {margin-top:3%;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish {position:relative; float:left; width:100%; margin:0 1%;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish .layer {position:absolute; background:rgba(0,0,0,0.7); top:85%; bottom:0; left:0; right:0; transition: all 1s;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish:hover .layer {top:-27%;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish .layer .layer_wp {max-width:100%; margin:0 auto; padding:1% 0;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish .layer .layer_wp p.sentence {} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish .layer .layer_wp p.sentence.over {font-size:16px; margin-top:30%;} /******************************************** instant ***********************************************************/ .menuInfo_wp .contents_wp .contents.instant .content_wp {margin-top:3%;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant {position:relative; float:left; width:100%; margin:0 1%;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant .layer {position:absolute; background:rgba(0,0,0,0.7); top:85%; bottom:0; left:0; right:0; transition: all 1s;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant:hover .layer {top:-27%;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant .layer .layer_wp {max-width:100%; margin:0 auto; padding:1% 0;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant .layer .layer_wp p.sentence {} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant .layer .layer_wp p.sentence.over {font-size:16px; margin-top:30%;} /******************************************** dessert ***********************************************************/ .menuInfo_wp .contents_wp .contents.dessert .content_wp {margin-top:3%;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert {position:relative; float:left; width:100%; margin:0 1%;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert .layer {position:absolute; background:rgba(0,0,0,0.7); top:85%; bottom:0; left:0; right:0; transition: all 1s;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert:hover .layer {top:-27%;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert .layer .layer_wp {max-width:100%; margin:0 auto; padding:1% 0;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert .layer .layer_wp p.sentence {} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert .layer .layer_wp p.sentence.over {font-size:16px; margin-top:30%;} /******************************************** newmenu ***********************************************************/ .newmenuInfo_wp ul:after {display:block; content:''; clear:both;} .newmenuInfo_wp ul {display: flex; flex-direction:row; flex-wrap:wrap; justify-content:flex-start; align-items:flex-start;} .newmenuInfo_wp ul li {width:23.875%; margin:0 1.5% 1.5% 0;} .newmenuInfo_wp ul li:nth-child(4n) {margin:0 0 1.5%;} .newmenuInfo_wp img {width:100%;} @media all and (max-width: 1200px) { /*********************************************** Sushi-roll ********************************************************/ .menuInfo_wp .contents_wp .contents .icon_wp ul {display:inline; margin:0; padding:0;} .menuInfo_wp .contents_wp .contents .icon_wp ul li {padding:0 6%;} .menuInfo_wp .contents_wp .contents .icon_wp ul li .icon_img img {width:100%;} .menuInfo_wp .contents_wp .contents .content_wp .content {position:relative; float:inherit; width:100%; margin: 3% auto;} .menuInfo_wp .contents_wp .contents .content_wp .content:hover .layer {top:0%;} .menuInfo_wp .contents_wp .contents .content_wp .content:hover .layer .layer_wp p.title, .menuInfo_wp .contents_wp .contents .content_wp .content:hover .layer .layer_wp p.sentence {display:none;} .menuInfo_wp .contents_wp .contents .content_wp .content:hover .layer .layer_wp p.sentence.over {display:block; margin-top:20%;} .menuInfo_wp .contents_wp .contents .content_wp .content .content_bg img{width:100%;} .menuInfo_wp .contents_wp .contents .content_wp .content .layer {position:absolute; background:rgba(240,115,4,0.8); top:unset; bottom:0; left:0; right:0; transition:unset;} .menuInfo_wp .contents_wp .contents .content_wp .content .content_bg .white_layer {display:none;} .menuInfo_wp .contents_wp .contents .content_wp .content .layer .layer_wp {max-width:90%; margin:0 auto; padding:3% 0;} .menuInfo_wp .contents_wp .contents .content_wp .content:nth-child(2) .layer .layer_wp {max-width:90%; margin:0 auto; padding:3% 0;} .menuInfo_wp .contents_wp .contents .content_wp .content:nth-child(3) .layer .layer_wp {max-width:90%; margin:0 auto; padding:3% 0;} .menuInfo_wp .contents_wp .contents .content_wp .content .layer .layer_wp p.sentence.over {display:none;} .menuInfo_wp .contents_wp .contents .content_wp .content .layer .layer_wp p.title {font-size:14px;} .menuInfo_wp .contents_wp .contents .content_wp .content .layer .layer_wp p.sentence {font-size:12px;} /*********************************************** Hotdish ********************************************************/ .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish {position:relative; float:inherit; width:100%; margin: 3% auto;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish:hover .layer {top:0%;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish:hover .layer .layer_wp p.title, .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish:hover .layer .layer_wp p.sentence {display:none;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish:hover .layer .layer_wp p.sentence.over {display:block; margin-top:10%;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish .content_bg img{width:100%;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish .layer {position:absolute; background:rgba(0,0,0,0.7); top:unset; bottom:0; left:0; right:0; transition:unset;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish .content_bg .white_layer {display:none;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish .layer .layer_wp {max-width:90%; margin:0 auto; padding:3% 0;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish .layer .layer_wp p.sentence.over {display:none;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish .layer .layer_wp p.title {font-size:14px;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish .layer .layer_wp p.sentence {font-size:12px;} /*********************************************** instant ********************************************************/ .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant {position:relative; float:inherit; width:100%; margin: 3% auto;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant:hover .layer {top:0%;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant:hover .layer .layer_wp p.title, .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant:hover .layer .layer_wp p.sentence {display:none;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant:hover .layer .layer_wp p.sentence.over {display:block; margin-top:18%;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant .content_bg img{width:100%;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant .layer {position:absolute; background:rgba(0,0,0,0.7); top:unset; bottom:0; left:0; right:0; transition:unset;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant .content_bg .white_layer {display:none;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant .layer .layer_wp {max-width:90%; margin:0 auto; padding:3% 0;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant .layer .layer_wp p.sentence.over {display:none;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant .layer .layer_wp p.title {font-size:14px;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant .layer .layer_wp p.sentence {font-size:12px;} /*********************************************** dessert ********************************************************/ .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert {position:relative; float:inherit; width:100%; margin: 3% auto;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert:hover .layer {top:0%;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert:hover .layer .layer_wp p.title, .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert:hover .layer .layer_wp p.sentence {display:none;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert:hover .layer .layer_wp p.sentence.over {display:block; margin-top:18%;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert .content_bg img{width:100%;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert .layer {position:absolute; background:rgba(0,0,0,0.7); top:unset; bottom:0; left:0; right:0; transition:unset;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert .content_bg .white_layer {display:none;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert .layer .layer_wp {max-width:90%; margin:0 auto; padding:3% 0;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert .layer .layer_wp p.sentence.over {display:none;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert .layer .layer_wp p.title {font-size:14px;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert .layer .layer_wp p.sentence {font-size:12px;} } @media all and (max-width:991px) { .newmenuInfo_wp ul {padding:0;} .newmenuInfo_wp ul li {width:49%; margin:0 2% 2% 0;} .newmenuInfo_wp ul li:nth-child(2n) {margin-right:0;} } @media all and (max-width: 768px) { .pcView {display:none} .mobileView {display:block} } p, td, li, dd, dt, .block, th {word-break:keep-all; word-wrap:break-word;} /************************************************* 메뉴안내 ********************************************************/ .menuInfo_wp {max-width:100%; margin:30px 0 100px;} /************************************************* 쿠우쿠우 창업 - 개설절차 ********************************************************/ .pcView {display:blcok;} .mobileView {display:none;} .new_step_wp {margin-top:30px;} .new_step_wp .contents_wp {width:100%; max-width:1185px; margin:0 auto;} .new_step_wp .contents_wp .section01:after, .new_step_wp .contents_wp .section02:after {clear:both; display:block; content:'';} .new_step_wp .contents_wp .title {text-align:center;} .new_step_wp .contents_wp .title p img {padding:0 5px 5px 0;} .new_step_wp .contents_wp .title p {color:#151515; font-size:23px; font-weight:500px;} .new_step_wp .contents_wp .title span {position:relative; z-index:1;} .new_step_wp .contents_wp .title span:after {content:""; position:absolute; left:0; bottom:8px; right:16px; margin:auto; background:#ffbf71; height:7px; z-index:-1; width:98%;} .new_step_wp .contents_wp .contents ul li .icon {} .new_step_wp .contents_wp .contents ul li .icon_title {color:#3f3f3f; font-size:17px; font-weight:400; margin:25px 0;} .new_step_wp .contents_wp .contents ul li .icon_txt {color:#707070; font-size:14px; font-weight:300;} .new_step_wp .contents_wp .section01 .contents {margin:20px 0 70px; width:100%; background:#fcfcfc; border:1px solid #f0f0f0; display:inline-block; padding:35px 0; } .new_step_wp .contents_wp .section01 .contents ul {display:inline-block; padding:0; } .new_step_wp .contents_wp .section01 .contents ul li {text-align:center; width:33.33333%; float:left; margin:25px 0;} .new_step_wp .contents_wp .section02 .contents {position:relative; margin:20px 0 70px; width:100%; background:url('../page/img/new_step/newstep_section02_bg.jpg') no-repeat; display:inline-block;} .new_step_wp .contents_wp .section02 .contents ul {display:inline-block; padding:18px 0; } .new_step_wp .contents_wp .section02 .contents ul li {text-align:center; width:33.33333%; float:left; margin:25px 0;} .new_step_wp .contents_wp .section02 .contents ul li .icon_title {margin:15px 0;} .new_step_wp .contents_wp .section02 .contents ul li:nth-child(1), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(2), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(3) {position:relative; top:25px; right:70px;} .new_step_wp .contents_wp .section02 .contents ul li:nth-child(4), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(5), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(6) {position:relative; top:15px; left:96px; width:30%;} .new_step_wp .contents_wp .section02 .contents ul li:nth-child(7), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(8), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(9) {position:relative; top:35px; left:155px; width:30%;} .new_step_wp .contents_wp .section03 .contents {position:relative; margin:20px 0 70px; width:100%; display:inline-block;} .new_step_wp .contents_wp .section03 .contents .success:after {display:block; content:''; clear:both;} .new_step_wp .contents_wp .section03 .contents .success h3.ttlsu {float:left; font-size:18px; line-height:26px; font-weight:700; background:none; padding:0;} .new_step_wp .contents_wp .section03 .contents .success p {float:right; font-size:14px; color:#232323; line-height:35px; margin:0;} .new_step_wp .contents_wp .section03 .contents table {width:100%;} .new_step_wp .contents_wp .section03 .contents table th {padding:15px 4px; text-align:center; font-size:15px; background:#ee7600; color:#fff; border-bottom:1px solid #ddd;} .new_step_wp .contents_wp .section03 .contents table th.rightLineW {border-right:1px solid #fff;} .new_step_wp .contents_wp .section03 .contents table tr.bgG {background:#f5f5f5;} .new_step_wp .contents_wp .section03 .contents table tr.lineOrange {border-top:2px solid #ee7600; border-bottom:2px solid #ee7600;} .new_step_wp .contents_wp .section03 .contents table tr.lineOrange td {font-size:17px; font-weight:500; color:#ee7600;} .new_step_wp .contents_wp .section03 .contents table td {padding:15px 4px; text-align:center; font-size:14px; color:#333; border-bottom:1px solid #ddd;} .new_step_wp .contents_wp .section03 .contents table td.rightLineG {border-right:1px solid #ddd;} .new_step_wp .contents_wp .section03 .contents table td.bottomLineN {border-bottom:0;} .new_step_wp .contents_wp .section03 .contents table td.txtLeft {text-align:left;} @media all and (max-width: 1200px) { .pcView {display:none} .mobileView {display:block;} .new_step_wp .contents_wp .section01 .contents ul li {padding:0 3%;} .new_step_wp .contents_wp .section02 .contents {background:none;} .new_step_wp .contents_wp .section02 .contents ul {width:100%;} .new_step_wp .contents_wp .section02 .contents ul li:nth-child(1), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(2), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(3), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(4), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(5), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(6), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(7), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(8), .new_step_wp .contents_wp .section02 .contents ul li:nth-child(9) {position:static; width:100%;} .new_step_wp .contents_wp .section02 .contents ul li .icon_title {margin:7px 0;} } @media all and (max-width: 768px) { .new_step_wp .contents_wp .section01 .contents ul li {width:50%; height: 330px;} } /************************************************* 쿠우쿠우 창업 - 개설절차 ********************************************************/ /*===================== 2018.08.13 수정 스타일 =====================*/ @media all and (max-width:1199px) { /* 연혁 수정 스타일 */ .history .contents_wp:after {height:2000px;} /* 메뉴안내 - 모바일에서 마우스오버시 나오는 텍스트 위치 수정 스타일 */ .menuInfo_wp .contents_wp .contents .content_wp .content:hover .layer .layer_wp p.sentence.over {margin-top:0; padding:30% 0;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish:hover .layer .layer_wp p.sentence.over, .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant:hover .layer .layer_wp p.sentence.over, .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert:hover .layer .layer_wp p.sentence.over {margin-top:0; padding:23% 0;} /* 개설절차 - 성공창업안내부분 수정 스타일 */ .new_step_wp .contents_wp .section01 .contents ul li {min-height:266px;} } @media all and (max-width:991px) { /* 연혁 수정 스타일 */ .history .contents_wp:after {height:2200px;} /* 매장찾기부분 수정 스타일 */ /* 개설절차 - 성공창업안내부분 수정 스타일 */ .new_step_wp .contents_wp .section01 .contents ul li {min-height:288px;} } @media all and (max-width:768px) { /* 연혁 수정 스타일 */ .history .contents_wp:after {height:2925px} } @media all and (max-width:615px) { /* 연혁 수정 스타일 */ .history .contents_wp:after {height:2925px;} } @media all and (max-width:565px) { /* 연혁 수정 스타일 */ .history .contents_wp:after {height:96.5%;} } @media all and (max-width:490px) { /* 연혁 수정 스타일 */ .history .contents_wp:after {height:96.5%;} /* 메뉴안내 - 모바일에서 마우스오버시 나오는 텍스트 위치 수정 스타일 */ .menuInfo_wp .contents_wp .contents .content_wp .content:hover .layer .layer_wp p.sentence.over, .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish:hover .layer .layer_wp p.sentence.over, .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant:hover .layer .layer_wp p.sentence.over, .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert:hover .layer .layer_wp p.sentence.over {margin-top:0; padding:18% 0;} } @media all and (max-width:450px) { /* 연혁 수정 스타일 */ .history .contents_wp:after {height:96.5%;} /* 메뉴안내 - 모바일에서 마우스오버시 나오는 텍스트 위치 수정 스타일 */ .menuInfo_wp .contents_wp .contents .content_wp .content:hover .layer .layer_wp p.sentence.over {margin-top:0; padding:23% 0;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish:hover .layer .layer_wp p.sentence.over, .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant:hover .layer .layer_wp p.sentence.over, .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert:hover .layer .layer_wp p.sentence.over {margin-top:0; padding:13% 0;} } @media all and (max-width:420px) { /* 연혁 수정 스타일 */ .history .contents_wp:after {height:96.5%;} /* 메뉴안내 - 모바일에서 마우스오버시 나오는 텍스트 위치 수정 스타일 */ .menuInfo_wp .contents_wp .contents .content_wp .content:hover .layer .layer_wp p.sentence.over {margin-top:0; padding:18% 0;} .menuInfo_wp .contents_wp .contents.hotdish .content_wp .content.hotdish:hover .layer .layer_wp p.sentence.over {margin-top:0; padding:10% 0;} .menuInfo_wp .contents_wp .contents.instant .content_wp .content.instant:hover .layer .layer_wp p.sentence.over {margin-top:0; padding:16% 0;} .menuInfo_wp .contents_wp .contents.dessert .content_wp .content.dessert:hover .layer .layer_wp p.sentence.over {margin-top:0; padding:16% 0;} } /************************************************* 고객지원 - 모바일상품권 ********************************************************/ .gift_wp {margin:30px 0 70px 0;} .gift_wp .contents_wp {width:100%; max-width:1185px; margin:0 auto;} .gift_wp .contents_wp .title {text-align:center; color:#2e2e2e; font-size:33px; margin:0 0 40px 0;} .gift_wp .contents_wp .title span {position:relative; font-weight:bold;} .gift_wp .contents_wp .title span:after {content:""; position:absolute; left:0; bottom:8px; right:16px; margin:auto; background:#ff8a00; height:7px; z-index:-1; width:98%;} .gift_wp .contents_wp .contents {width:100%; background:#fcfcfc; border:1px solid #f0f0f0; padding:35px 0;} .gift_wp .contents_wp .contents li {text-align:center; width:33%; display:inline-block; margin:25px 0; vertical-align:top; } .gift_wp .contents_wp .contents li .icon_title {color:#3f3f3f; font-size:17px; font-weight:400; margin:25px 0;} @media all and (max-width: 768px) { .gift_wp .contents_wp .title {font-size:23px;} .gift_wp .contents_wp .contents li {width:100%; margin:15px 0;} .gift_wp .contents_wp .contents li .icon img {width:60%; max-width:270px;} .gift_wp .contents_wp .contents li .icon_title {font-size:14px; margin:10px 0;} }