#header .telWrap {position: absolute; width:250px; right:120px;} /* #header .telWrap .point{position:absolute; top:-44px; width:180px; height:90px; left:150px; background:url(/design/default/images/icon_tel.png) no-repeat -1px 34px;} */ #header .telWrap .point{text-align:right; width:250px; background:url(/design/default/images/icon_tel.png) no-repeat 7px 7px;} #header .telWrap .point p{ display:inline-block; vertical-align:middle;} #header .telWrap .point .cs{padding-top:0px; padding-left:20px;} #header .telWrap .point .cs span{float:left; display:inline-block; padding:5px 5px 0 0; } #header .telWrap .point .cs strong{float:left; display:inline-block; font-family:'Outfit','Pretendard'; font-size:32px; font-weight:bold; /*color:#b07b66; color:#E1CEB4; */ color:#1d1c08; } #header .onlineWrap {position: absolute; right:450px; width:160px; background:#b50037; height:100%; font-size:18px; text-align:center;line-height:90px;} #header .onlineWrap p {display: inline-block; vertical-align:middle; font-size:20px; text-align:center;line-height:90px;} #header .onlineWrap a {display: inline-block; color:#fff; line-height:90px; font-weight:400;} @media (max-width: 1460px) { #header .telWrap {position: absolute; width:180px; right:110px;} #header .telWrap .point{text-align:right; width:180px; background:url(/design/default/images/icon_tel.png) no-repeat 7px 7px;} #header .telWrap .point .cs strong{float:left; display:inline-block; font-family:'Outfit','Pretendard'; font-size:28px; font-weight:bold; /*color:#b07b66; color:#E1CEB4; */ color:#1d1c08; } #header .onlineWrap {position: absolute; right:300px; width:150px; height:100%; padding:0 10px;font-size:18px; text-align:center;line-height:90px;} } @media (max-width: 1200px) { #header .telWrap {position: absolute; width:166px; right:70px;} #header .telWrap .point{text-align:right; width:166px; background:url(/design/default/images/icon_tel.png) no-repeat 0px 6px; background-size:30px 31px;} #header .telWrap .point .cs strong{float:left; display:inline-block; font-family:'Outfit','Pretendard'; font-size:27px; font-weight:bold; /*color:#b07b66; color:#E1CEB4; */ color:#1d1c08; } #header .onlineWrap {position: absolute; right:240px; width:150px; height:100%; padding:0 10px;font-size:18px; text-align:center;line-height:90px;} } @media (max-width: 768px) { #header .telWrap {width:170px; right:40px;} #header .telWrap .point{text-align:right; background:url(/design/default/images/icon_tel.png) no-repeat 0px 3px;background-size:25px;} #header .telWrap .point .cs strong{padding-right:5px;font-size:21px;} #header .onlineWrap {display:none;} } @media (max-width: 400px) { #header .telWrap {width:170px; right:32px;} #header .telWrap .point{text-align:right; background:url(/design/default/images/icon_tel.png) no-repeat 0px 3px;background-size:25px;} } /* @media (max-width: 1730px) { #header .gnb .t_util .point{top:-54px; width:250px; height:90px; right:-320px; background:url(/design/default/images/icon_tel.png) no-repeat -1px 30px;} } @media (max-width: 1650px) { #header .gnb .t_util .point{top:-58px; width:250px; height:90px; right:-290px; background:url(/design/default/images/icon_tel.png) no-repeat -1px 30px;} } @media (max-width: 1464px) { #header .gnb .t_util .point{top:-54px; width:250px; height:90px; right:-360px; background:url(/design/default/images/icon_tel.png) no-repeat -1px 30px;} #header .gnb .t_util .point .cs strong{font-size:24px;} } @media (max-width: 1199px) { #header .gnb .t_util .point{top:-42px; width:250px; height:90px; right:-470px; background:url(/design/default/images/icon_tel.png) no-repeat -1px 30px;} #header .gnb .t_util .point .cs strong{font-size:24px;} } @media (max-width:1199px) { #header .gnb .t_util .point{top:-42px; width:250px; height:90px; right:-430px; background:url(/design/default/images/icon_tel.png) no-repeat -1px 30px;} } @media (max-width:767px) { #header .gnb .t_util .point{top:-72px; width:250px; height:90px; right:-360px; background:url(/design/default/images/icon_tel.png) no-repeat -1px 30px;} } @media (max-width: 479px) { #header .gnb .t_util .point{top:-69px; width:250px; height:90px; right:-220px; background:url(/design/default/images/icon_tel.png) no-repeat -1px 28px;} #header .gnb .t_util .point .cs strong{font-size:20px;} } */ /* ------------------------------ * sub - menu ------------------------------ */ div.sub_tab_box{width: 100%;position: relative;z-index: 500; margin: -0px auto 0; top:0; left:0; transform:translate(0%, 0%); border-bottom:1px solid #b2b2b2;} ul.sub_tab2{overflow:hidden;font-size:0; text-align:center;} ul.sub_tab2 li{display:inline-block; position:relative;vertical-align: top; width:auto;} ul.sub_tab2 li a{position:relative;font-family:'Noto Sans KR',sans-serif; color: #000;opacity:0.5; font-size:17px; font-weight:400; letter-spacing:-.1px; display: block; box-sizing: border-box; padding:15px 40px;} ul.sub_tab2 li a:hover{color:#000;opacity:1.0;} ul.sub_tab2 li.on a{color:#000 !important; opacity:1.0;} ul.sub_tab2.sub_tab_wide{max-width: 98%; } ul.sub_tab2.sub_tab_wide li{padding:0 20px;} p.sm {text-align:left; padding-top:10px;font-size: 12px; font-weight: 400; color: #717176; letter-spacing: -0.04em} @media(max-width:768px){ div.sub_top{margin:0px auto 0; padding-top:60px;} div.sub_top div.sub_bg_img{height:180px;} div.sub_top div.inner_wrap .sub_title01{line-height:40px;} div.sub_top div.inner_wrap .sub_title02{line-height:22px;} div.sub_top div.sub_top_bg .line{margin:5px auto;} div.sub_top div.sub_top_bg .line.on{width:142px;} div.sub_top div.inner_wrap .sub_title01{font-size:30px;} div.sub_top div.inner_wrap .sub_title01.on{font-size:30px;} div.sub_top div.inner_wrap .sub_title02{font-size:16px;} div.sub_top div.inner_wrap .sub_title02.on{font-size:16px;} ul.sub_tab > li{line-height:50px;} ul.sub_tab li>a{height:50px;} ul.sub_tab > li:nth-child(1),ul.sub_tab > li:nth-child(2){display:none;} ul.sub_tab > li.dep2{width:100%;} ul.sub_tab li ul li{height:50px; line-height:50px;} ul.sub_tab li ul li a{height:50px; line-height:50px;} ul.sub_tab2{padding:10px 0;} ul.sub_tab2 li{padding:0 10px;} ul.sub_tab2.sub_tab_wide li{padding:0 10px;} ul.sub_tab2 li a{ font-size:13px; padding:5px 3px;} .sgnb{width:95%; margin:0 auto;} .sgnb a{ width:49.3%; font-size:13px; height:40px; line-height:38px; } .sgnb a span{display:none;} p.sm {padding:5px 10px 0px;} } @media (max-width: 479px) { p.sm {font-size:10px;} } /* ------------------------------ * sub - hero ------------------------------ */ .brand_area {text-align:center;} .brand_area h2 {font-size:22px; color:#000; font-weight:500;} .brand_area h3 {font-size:22px; color:#5d5d5d; font-weight:500; padding-bottom:20px;} .brand_area h3.big {font-size:24px; color:#5d5d5d; font-weight:600; padding-bottom:0px;} .brand_area h4 {text-align:right; font-size:22px; color:#b9966e; font-weight:600; padding-bottom:10px;} @media(max-width:768px){ .brand_area h3.big {font-size:20px; font-weight:500; margin-bottom:20px;} .brand_area h4 {text-align:center; font-size:20px; padding-top:15px;padding-bottom:15px;} } .brand_inforWrap {text-align:left; overflow:hidden; max-width:1400px; width:100%; margin:0 auto; padding-bottom:20px;} .brand_inforWrap .Left {float:left; width:40%; text-align:left;} .brand_inforWrap .Right {float:left; width:60%; text-align:right; padding:100px 0px 0px 40px;} .brand_inforWrap .Right h2 {font-size:22px; color:#ff5fa4; font-weight:700; line-height:50px;} .brand_inforWrap .Right h3 {font-size:22px; color:#8fc43d; font-weight:600; line-height:30px;} .brand_inforWrap .Right p {font-size:18px; color:#3b3b3b; font-weight:400; line-height:35px;} .brand_inforWrap .Right p img {padding-top:30px;} @media(max-width:1200px){ .brand_inforWrap {padding-bottom:10px;} } @media(max-width:900px){ .brand_inforWrap .Right h2 {font-size:18px; line-height:30px;} } @media(max-width:768px){ .brand_inforWrap .Right {padding:35px 0px 0px 40px;} } @media(max-width:479px){ .brand_inforWrap {padding-top:50px;} } .brand_area .imgWrap {overflow:hidden;max-width:1400px; width:100%; position:relative; padding-top:0px; margin-bottom:150px; margin:0 auto; text-align:left;} .brand_area .imgWrap .step1 {overflow:hidden; width:100%; margin-bottom:2%;} .brand_area .imgWrap .step1 .Big {float:left; width:66%; height:650px;} .brand_area .imgWrap .step1 .Big .LeftWrap {height:900px;} .brand_area .imgWrap .step1 .Big .brown {height:300px; position: relative; background:#272724; padding:30px 40px; margin-bottom:2%; box-sizing:border-box;} .brand_area .imgWrap .step1 .Big .brown .textwrap {padding:30px 0px 40px;} .brand_area .imgWrap .step1 .Big .brown h2{color:#fff; font-size:18px; font-weight:500;} .brand_area .imgWrap .step1 .Big .brown h1{color:#f390bb; font-size:22px; line-height:40px; font-weight:600;} .brand_area .imgWrap .step1 .Big .brown .boxwrap {width:80%; display: flex; flex-direction:row; justify-content:flex-start; align-items:flex-start; flex-wrap:nowrap; } .brand_area .imgWrap .step1 .Big .brown .boxwrap .box {flex:1;} .brand_area .imgWrap .step1 .Big .brownImg {margin-top:3%; height:600px;} .brand_area .imgWrap .step1 .Big .brown .plus {position: absolute; bottom:30px; right:50px;} .brand_area .imgWrap .step1 .Big2 {float:left; width:66%; height:650px;} .brand_area .imgWrap .step1 .Big2 .LeftWrap {height:900px;} .brand_area .imgWrap .step1 .Big2 .brown {height:300px; position: relative; background:#272724; padding:30px 40px; margin-bottom:2%; box-sizing:border-box;} .brand_area .imgWrap .step1 .Big2 .brown .textwrap {padding:30px 0px 40px;} .brand_area .imgWrap .step1 .Big2 .brown h2{color:#fff; font-size:18px; font-weight:500;} .brand_area .imgWrap .step1 .Big2 .brown h1{color:#f390bb; font-size:22px; line-height:40px; font-weight:600;} .brand_area .imgWrap .step1 .Big2 .brown .boxwrap {width:80%; display: flex; flex-direction:row; justify-content:flex-start; align-items:flex-start; flex-wrap:nowrap; } .brand_area .imgWrap .step1 .Big2 .brown .boxwrap .box {flex:1;} .brand_area .imgWrap .step1 .Big2 .brownImg {margin-top:3%; height:600px;} .brand_area .imgWrap .step1 .Big2 .brown .plus {position: absolute; bottom:30px; right:50px;} .brand_area .imgWrap .step1 .Small {position: relative; float:left; width:32%; box-sizing:border-box;} .brand_area .imgWrap .step1 .greenbg {height:647px; background:url(/design/default/images/main/green_bg.png) no-repeat; background-position:bottom;} .brand_area .imgWrap .Small .green_logo {position: absolute; bottom:30px; left:0px;} .brand_area .imgWrap .step1 .mR {margin-right:2%} .brand_area .imgWrap .step1 .Small p {color:#323232; font-size:18px; text-align:left; line-height:30px; font-weight:500;} .brand_area .imgWrap .step1 .Small p strong {font-size:25px; text-align:left; line-height:60px; font-weight:700;} .brand_area .imgWrap .step1 .Small .rightWrap {height:900px; overflow:hidden;} .brand_area .imgWrap .step1 .Small .brown {height:450px; position: relative; background:#272724; padding:30px 40px; box-sizing:border-box;} .brand_area .imgWrap .step1 .Small .brown .textwrap {padding:90px 0px 25px;} .brand_area .imgWrap .step1 .Small .brown h2{color:#fff; font-size:18px; line-height:35px; font-weight:500;} .brand_area .imgWrap .step1 .Small .brown h1{color:#f390bb; font-size:22px; line-height:35px; font-weight:600;} .brand_area .imgWrap .step1 .Small .brown .titleEng2 {padding-top:70px;} .brand_area .imgWrap .step1 .Small .brown .boxwrap {display: flex; flex-direction:row; justify-content:flex-start; justify-content: space-evenly; align-items:center; flex-wrap:nowrap; } .brand_area .imgWrap .step1 .Small .brown .boxwrap .box {flex:1} .brand_area .imgWrap .step1 .Small .brownImg {height:450px; margin-bottom:7%;} .brand_area .imgWrap .step1 .Small .brown .plus {position: absolute; bottom:60px; right:50px;} .brand_area .imgWrap .Small .txtWrap {position:relative; text-align:left; padding-left:20px;} .brand_area .imgWrap .Small .txtWrap p {font-size:17px; color:#3b3b3b; font-weight:400; padding-bottom:20px;} .brand_area .imgWrap .Small .txtWrap h1 {font-size:38px; color:#3b3b3b; font-weight:400; padding-bottom:30px;} .brand_area .imgWrap .Small .txtWrap h1 span {font-weight:700;} .brand_area .imgWrap .Small .txtWrap h3 {font-size:19px; color:#cb6f61; font-weight:400;} .brand_area .imgWrap .Small .txtWrap h2 {font-size:34px; color:#004655; font-weight:700;padding-bottom:30px;} .brand_area .imgWrap .Small .txtWrap h2 span {font-size:19px; font-weight:300;} .brand_area .imgWrap .step2 {overflow:hidden;max-width:1400px; width:100%; margin-top:1%;} .brand_area .imgWrap .step2 .titleWrap {padding:100px 0px 50px 0px; text-align:center;} .brand_area .imgWrap .step2 .titleWrap p {font-size:22px; color:#595858; font-weight:600;} .brand_area .imgWrap .step2 .titleWrap p.tit {font-size:37px; color:#595959; font-weight:500;} .brand_area .imgWrap .step2 .divide4 {background:#eeeeee; overflow:hidden;max-width:1400px; width:100%; padding:50px 0px;} .brand_area .imgWrap .step2 .divide4 li {width:25%; float:left; text-align:center; box-sizing:border-box;} .brand_area .imgWrap .step2 .divide4 li + li {border-left:1px solid #fff;} .brand_area .imgWrap .step2 .divide4 li p {font-size:18px; color:#3b3b3b; line-height:30px; padding-top:10px;} .brand_area .imgWrap .step2 .txtWrap {text-align:center; padding:100px 0px 0px;} .brand_area .imgWrap .step2 .txtWrap h1 {font-size:25px; line-height:50px; color:#004655; font-weight:600;} .brand_area .imgWrap .step2 .txtWrap h2 {font-size:20px; color:#8fc43d; font-weight:500;} @media(max-width:1200px){ .brand_area .imgWrap .step1 {margin-bottom:10px;} .brand_area .imgWrap .step1 .Big {width:73%; height:594px;} .brand_area .imgWrap .step1 .Big .brown {margin-bottom:10px;} .brand_area .imgWrap .step1 .Big .brownImg {margin-top:10px;} .brand_area .imgWrap .step1 .Big2 {width:73%; height:594px;} .brand_area .imgWrap .step1 .Big2 .brown {margin-bottom:10px;} .brand_area .imgWrap .step1 .Big2 .brownImg {margin-top:10px;} .brand_area .imgWrap .step1 .mR {margin-right:1%} .brand_area .imgWrap .step1 .Small {width:26%;} .brand_area .imgWrap .step1 .Small p {background:#fff; padding-bottom:10px; font-size:16px; line-height:24px;} .brand_area .imgWrap .step1 .greenbg {height:594px;background:url(/design/default/images/main/green_bg.png) no-repeat; } .brand_area .imgWrap .step1 .Big .brown .textwrap {padding:30px 0px 30px;} .brand_area .imgWrap .step1 .Small .brownImg {margin-bottom:10px;} } @media(max-width:900px){ .brand_area .imgWrap .step1 {height:460px;} .brand_area .imgWrap .step1 .Small .brownImg {height:180px; overflow:hidden;} .brand_area .imgWrap .step1 .Small {height:460px;} .brand_area .imgWrap .step1 .Small p {background:none; padding-bottom:0px; font-size:16px; line-height:24px;} .brand_area .imgWrap .step1 .greenbg {height:460px;} .brand_area .imgWrap .step1 .Small .rightWrap {height:600px;} .brand_area .imgWrap .Small .txtWrap {padding-left:10px;} .brand_area .imgWrap .Small .step1Img {display:none;} .brand_area .imgWrap .step1 .Big {width:73%; height:460px;} .brand_area .imgWrap .step1 .Big .brown {height:220px; padding:10px 20px; margin-bottom:1%; box-sizing:border-box;} .brand_area .imgWrap .step1 .Big .brown h2{font-size:16px;} .brand_area .imgWrap .step1 .Big .brown h1{font-size:18px; line-height:35px;} .brand_area .imgWrap .step1 .Big .brown .textwrap {padding:20px 0px 20px;} .brand_area .imgWrap .step1 .Big2 .brown .plus {width:15px; height:15px; bottom:30px; right:20px;} .brand_area .imgWrap .step1 .Big2 {width:73%; height:460px;} .brand_area .imgWrap .step1 .Big2 .brown {height:220px; padding:10px 20px; margin-bottom:1%; box-sizing:border-box;} .brand_area .imgWrap .step1 .Big2 .brown h2{font-size:16px;} .brand_area .imgWrap .step1 .Big2 .brown h1{font-size:18px; line-height:35px;} .brand_area .imgWrap .step1 .Big2 .brown .textwrap {padding:20px 0px 20px;} .brand_area .imgWrap .step1 .Big2 .brown .plus {width:15px; height:15px; bottom:30px; right:20px;} .brand_area .imgWrap .step1 .Small .brown {padding:10px 20px;} .brand_area .imgWrap .step1 .Small .brown h2{font-size:16px; line-height:20px; padding-bottom:10px;} .brand_area .imgWrap .step1 .Small .brown h1{font-size:18px; line-height:24px;} .brand_area .imgWrap .step1 .Small .brown .textwrap {padding:15px 0px 10px;} .brand_area .imgWrap .step1 .Small .brown .titleEng2 {padding-top:30px;} .brand_area .imgWrap .step1 .Small .brown .plus {width:15px; height:15px; bottom:200px; right:20px;} } @media(max-width:768px){ .brand_area .imgWrap .step1 {height:580px;} .brand_area .imgWrap .step1:nth-child(2) {height:1100px;} .brand_area .imgWrap .step1 .Big {float:none; width:100%;height:450px;} .brand_area .imgWrap .step1 .Big2 {float:none; width:100%;height:800px;} .brand_area .imgWrap .step1 .Small {float:none; width:100%; padding:40px 0px 0px 0px; margin-left:0%;} .brand_area .imgWrap .step1 .Small br {display:none;} .brand_area .imgWrap .step1 .greenbg {height:120px;background:url(/design/default/images/main/green_bg3.png) no-repeat; } .brand_area .imgWrap .step1 .green_logo {display:none;} .brand_area .imgWrap .Small .txtWrap {position:relative; text-align:center; padding-left:0px;} .brand_area .imgWrap .Small .txtWrap h1 {font-size:30px; text-align:center; padding-bottom:15px;} .brand_area .imgWrap .step1 .Big .brownImg {height:600px;} .brand_area .imgWrap .step1 .Big2 .brownImg {height:600px;} .brand_area .imgWrap .step1 .Small .brownImg {display:none;} .brand_area .imgWrap .step1 .Small .brown {height:200px;} .brand_area .imgWrap .step1 .Small .brown .plus {width:15px; height:15px; bottom:30px; right:20px;} } @media(max-width:693px){ .brand_area .imgWrap .step1 .greenbg {height:160px;} } @media (max-width: 479px) { .brand_inforWrap .Left {float:none; width:100%; text-align:center;} .brand_inforWrap .Right {float:none; width:100%; text-align:center; padding:40px 0px 0px 0px;} .brand_area .imgWrap .step1 .Small p {background:none; padding-bottom:0px; font-size:14px; line-height:20px;} .brand_area .imgWrap .step1 .Small p strong {font-size:16px; text-align:left; line-height:24px; font-weight:700;} .brand_area .imgWrap .step1 .greenbg {height:120px;} .brand_area .imgWrap .step2 .divide4 {padding:0px 0px;} .brand_area .imgWrap .step2 .divide4 li {width:50%; float:left; text-align:center; padding:20px 0px; box-sizing:border-box;} .brand_area .imgWrap .step2 .divide4 li + li {border-left:1px solid #fff; border-top:1px solid #fff;} .brand_area .imgWrap .step2 .divide4 li:nth-child(2) {border-top:0px solid #fff;} .brand_area .imgWrap .step2 .divide4 li:nth-child(3) {border-left:0px solid #fff;} .brand_area .imgWrap .step2 .txtWrap h1 {font-size:20px; line-height:40px; color:#004655; font-weight:600;} .brand_area .imgWrap .step2 .txtWrap h2 {font-size:17px; color:#8fc43d; font-weight:500;} } .brand_area .imgWrap .txtWrapBlue {background:#232228; padding:30px 50px;} .brand_area .imgWrap .txtWrapBlue h3 {padding-bottom:30px;} .brand_area .imgWrap .txtWrapBlue p {position:relative; font-size:18px; color:#fff; line-height:60px; padding-bottom:50px;} .brand_area .imgWrap .txtWrapBlue p.img {font-size:18px; color:#fff; line-height:30px; padding-bottom:50px;} .brand_area .imgWrap .txtWrapBlue p.txtw {font-size:19px; color:#fff; line-height:30px; padding-bottom:30px;} .brand_area .imgWrap .txtWrapBlue p img.plus {position: absolute; bottom:48px; right:0px;} .brand_area .imgWrap .txtWrapBlue p.eng {font-size:19px; font-weight:600; padding-bottom:30px;} @media(max-width:768px){ .brand_area .imgWrap .txtWrapBlue {width:100%; background:#232228; padding:20px 10px;} .brand_area .imgWrap .txtWrapBlue p {font-size:14px; color:#fff; line-height:20px; padding-bottom:30px;} .brand_area .imgWrap .txtWrapBlue p.img {padding:0px 0px 30px;} .brand_area .imgWrap .txtWrapBlue p.img {font-size:15px; color:#fff; line-height:24px; padding-bottom:20px;} } .brand_area .imgWrap .txtWrapBlue2 {background:#10253f; padding:50px 10px; text-align:center;} .brand_area .imgWrap .txtWrapBlue2 h3 {text-align:center; font-size:20px; line-height:26px; color:#b07b66; padding-bottom:30px;} .brand_area .imgWrap .txtWrapBlue2 p {text-align:center; font-size:20px; letter-spacing:10; color:#fff; font-weight:lighter; line-height:30px; padding-bottom:50px;} .brand_area .imgWrap .txtWrapBlue2 p.bold {font-size:20px; letter-spacing:-1; font-weight:600;} @media(max-width:768px){ .brand_area .imgWrap .txtWrapBlue2 {width:100%; background:#192c55; padding:40px 60px;} .brand_area .imgWrap .txtWrapBlue2 h3 {text-align:center; font-size:18px; line-height:26px; color:#b07b66; padding-bottom:20px;} .brand_area .imgWrap .txtWrapBlue2 p {text-align:center; font-size:17px; letter-spacing:10; color:#fff; font-weight:lighter; line-height:20px; padding-bottom:30px;} } .brand_area .textWrap {text-align:center; padding-top:40px; } .brand_area .textWrap h2 {padding-top:10px; font-size:24px; color:#3b3b3b; font-weight:700; line-height:30px;} .brand_area .textWrap p {font-size:19px; color:#5d5d5d;} @media(max-width:768px){ .brand_area .textWrap h2 {font-size:20px;} .brand_area .textWrap p {font-size:16px;} } .brand_area .tableWrap {text-align:left; padding-top:0px;} .brand_area .tableWrap p.menuTitle {text-align:left; font-size:25px; color:#3b3b3b; font-weight:500; padding:9px 0px 10px;} .brand_area .tableWrap p {padding-top:10px;font-size: 12px; font-weight: 400; color: #717176; letter-spacing: -0.04em} @media(max-width:900px){ .brand_area .tableWrap p.menuTitle {font-size:18px; padding:30px 0px 5px;} .brand_area .tableWrap {text-align:left; padding-top:0px;} } @media(max-width:768px){ .brand_area .tableWrap p {padding-top:10px;font-size: 10px; font-weight: 400; color: #717176; letter-spacing: -0.04em} } @media(max-width:479px){ .brand_area .tableWrap p.menuTitle {font-size:16px;padding:30px 0px 5px;} } .row { display: flex; flex-wrap: wrap; margin-top:15px; margin-bottom:10px; } @media(max-width:768px){ .row {display:block; margin:0 auto; text-align:center;margin-top:0px; margin-bottom:0px;} } .brand_area .photoW{overflow:hidden;max-width:1400px; width:100%; position:relative; padding-top:0px; margin-bottom:150px; margin:0 auto; text-align:center;} .brand_area .photoW li {box-sizing:border-box; text-align:left;} .brand_area .photoW li.txt {position:relative; float:left;width:52%; padding:50px 30px 0px 30px;} .brand_area .photoW li.txt p.tit {font-size:17px; color:#131313; line-height:32px;padding-top:60px;} .brand_area .photoW li.txt p.tit span {font-weight:bold;} .brand_area .photoW li.txt p.ceo {font-size:19px; color:#444444; line-height:32px;padding-top:60px; text-align:right; font-weight:700;} .brand_area .photoW li.txt p {font-size:18px; line-height:24px; color:#3e3e3e; padding-bottom:20px;} .brand_area .photoW li.txt p span {font-size:35px; font-weight:lighter;} .brand_area .photoW li.txt p.gray {font-size:68px; line-height:70px;color:#949da4; font-weight:900;} .brand_area .photoW li.txt p.blue {padding-top:30px;font-size:28px; line-height:32px;color:#0069a7; font-weight:700;} .brand_area .photoW li.txt p.black {padding-top:30px;font-size:26px; line-height:30px;color:#3b3b3b; } .brand_area .photoW li.txt p.black span {font-size:40px; font-weight:lighter;} .brand_area .photoW li.img {float:left;width:100%;} .brand_area .photoW li.img p {padding-top:10px;font-size: 12px; font-weight: 400; color: #717176; letter-spacing: -0.04em} .brand_area .photoW p.sm {text-align:left; padding-top:10px;font-size: 12px; font-weight: 400; color: #717176; letter-spacing: -0.04em} .brand_area .photoW .brandImg img {padding-top:0px;} .brand_area .textFrame {width:100%; max-width:1345px; background:#dd0000; text-align:center; padding:40px 20px;} .brand_area .textFrame p {color:#fff; font-size:18px; line-height:30px; font-weight:300;} .brand_area .textFrame p.wide {color:#b1a9a9; font-size:17px; line-height:24px; letter-spacing:20px; padding-bottom:20px; font-weight:500;} .brand_area .textFrame p.yellow {color:#fffc00; font-size:23px; line-height:40px; font-weight:700;} .brand_area .textFrame p + p {padding-bottom:20px;} .brand_area .photoW li.txt p.menuTitle {font-size:20px; color:#3b3b3b; font-weight:500; padding:9px 0px 10px;} .company-intro-tbl{width:100%; box-sizing:border-box;} .company-intro-tbl th, .company-intro-tbl td{font-family:'Noto Sans KR',sans-serif; font-size:17px; line-height:1.2em; padding:15px 15px; background-color:#fff; font-weight:400; } .company-intro-tbl th.spa{text-align:justify;} .company-intro-tbl tr:first-child th{border-top:6px solid #272724; padding-top:25px;} .company-intro-tbl tr:first-child td{border-top:6px solid #d4d4d4; padding-top:25px;} .company-intro-tbl tr:last-child th{border-bottom:1px solid #c1c1c1; padding-bottom:25px;} .company-intro-tbl tr:last-child td{border-bottom:1px solid #c1c1c1; padding-bottom:25px;} .company-intro-tbl th{background:#272724; color:#fff; text-align:justify; letter-spacing:10px; text-align:center;} @media(max-width:900px){ .company-intro-tbl th, .company-intro-tbl td{font-size:14px; line-height:1.5em; padding:10px 10px; font-weight:400; } } @media(max-width:768px){ .brand_area .photoW li.txt {float:none;width:100%; padding:30px 0px 0px 0px;} .brand_area .photoW li.img {float:none;width:100%;} .brand_area .photoW li.txt p.menuTitle {font-size:18px;} .company-intro-tbl th, .company-intro-tbl td{font-size:12px; line-height:1.4em; padding:10px 10px; font-weight:400; } .company-intro-tbl tr:first-child th{border-top:3px solid #0a1e3c; padding-top:15px;} .company-intro-tbl tr:first-child td{border-top:3px solid #d4d4d4; padding-top:15px;} .company-intro-tbl th{letter-spacing:1px;} .brand_area .textFrame p {color:#fff; font-size:15px; line-height:20px; font-weight:300;} .brand_area .textFrame p.wide {color:#b1a9a9; font-size:14px; line-height:20px; letter-spacing:20px; padding-bottom:20px; font-weight:500;} .brand_area .textFrame p.yellow {color:#fffc00; font-size:18px; line-height:30px; font-weight:700;} } @media(max-width:479px){ .brand_area .photoW li.img p {padding-top:10px;font-size: 10px; font-weight: 400; color: #717176; letter-spacing: -0.04em} .company-intro-tbl th, .company-intro-tbl td{font-size:11px; line-height:1.0em; padding:5px 5px; font-weight:400; } .company-intro-tbl tr:first-child th{border-top:3px solid #0a1e3c; padding-top:5px 10px;} .company-intro-tbl tr:first-child td{border-top:3px solid #d4d4d4; padding-top:15px;} } .map {display:block; overflow:hidden;clear:both; padding-bottom:50px;} .map:nth-child(2) {padding-bottom:100px;} .map .maptit {float:left;background:#00453b; color:#ffffff; font-size:20px; line-height:50px; width:130px; text-align:center;} .map_info{margin:0 auto; overflow:hidden; background:#b07b66;display:block; position:relative;} .map_info li{font-size:19px; line-height:50px;padding:0 40px; float:left; color:#fff;} .map_info li span{padding-right:50px;} @media(max-width:768px){ .map .maptit {float:none;background:#00453b; color:#ffffff; font-size:15px; line-height:45px; width:100%; text-align:left;padding-left:20px;} .map_info{margin:20px auto 10px; overflow:auto; padding:10px 0px;position:relative;} .map_info li{width:100%; font-size:13px;line-height:20px;padding:0 10px; } .map_info li span{padding-right:10px; display:block;} .second {padding-top:0px;} } .locationTit {text-align:left; padding-left:150px; padding-bottom:15px;} .mapBig {overflow:hidden; width:100%; max-width:1755px; position:relative; padding-top:20px; padding-bottom:50px; margin:0 auto; text-align:center;} .mapBig p {width:100%; max-width:1400px; font-size:22px; color:#3e3e3e; font-weight:400; line-height:40px; margin:0 auto; } .mapBig h2 {font-size:25px; color:#3e3e3e; font-weight:600;text-align:center;} .mapBig p.sm {text-align:left; padding-top:10px;font-size: 12px; font-weight: 400; line-height:18px; color: #717176; letter-spacing: -0.04em} .mapBig p.white {text-align:right; font-size: 20px; font-weight: 400; line-height:35px; padding-bottom:10px; color: #fff; letter-spacing: -0.04em} .mapBrown {overflow:hidden; width:100%; position:relative; padding-top:20px; margin:0 auto; text-align:center;} .mapBrown .inner {width:100%; max-width:1400px;} .mapBrown .txtWrap {text-align:left;} .mapGray {background:#eaeaea; overflow:hidden; width:100%; position:relative; padding-top:90px; padding-bottom:50px; margin:0 auto; text-align:center;} .mapGray .inner {width:100%; max-width:1400px; margin:0 auto; } .mapGray .inner h2 {font-size:28px; color:#0a1e3c; font-weight:700; padding-bottom:50px;} .mapGray .inner h3 {font-size:28px; color:#0a1e3c; font-weight:700; padding-bottom:10px;} .mapGray .inner h4 {font-size:22px; color:#242424; font-weight:400; line-height:30px; padding-bottom:10px;} .mapGray .inner p {font-size:24px; color:#0a1e3c; font-weight:400; padding-bottom:10px;} .mapGray .inner p.f19 {padding-top:20px; font-size:19px; color:#0a1e3c; font-weight:400; padding-bottom:10px;} .mapGray .inner .BrowntxtWrap {padding-top:0px; text-align:left;} .mapGray .inner .BrowntxtWrap h1 {font-size:24px; color:#b9966e; font-weight:500;} .mapGray .inner .BrowntxtWrap p {font-size:18px; color:#343434; font-weight:400; line-height:24px; padding:50px 0px;} .mapGray .innerB {width:100%; max-width:1400px; padding:50px 0px;margin:0 auto; background:#0a1e3c;} .mapGray .innerB h2 {font-size:28px; color:#fff; font-weight:700;padding-bottom:15px;} .mapGray .innerB h3 {font-size:23px; color:#b9966e; font-weight:500;padding-bottom:30px;} .mapGray .innerB p {font-size:18px; color:#fefefe; line-height:28px; font-weight:300;} .studyBrown {background:#b9966e; overflow:hidden; width:100%; position:relative; padding:80px 0; margin:0 auto; text-align:center;} .studyBrown .inner {margin:0 auto; width:100%; max-width:1400px; text-align:center;} .studyBrown .inner p {color:#0a1e3c; font-size:24px; font-weight:300;} .studyBrown .inner h2 {color:#0a1e3c; font-size:28px; font-weight:600;} .studyBrown .inner .studyFrame {padding:50px 0px;} .studyBrown .inner .studyFrame h2 {color:#fff; font-size:24px; font-weight:500; line-height:34px;} .studyBrown .inner .studyFrame .blueRound {position:relative; padding-top:30px; text-align:center;} .studyBrown .inner .studyFrame .blueRound h2 {display:flex; align-items:center; justify-content:center; margin:0 auto; width:180px; height:180px; background:#0a1e3c; border-radius:100%; font-size:24px; color:#dda361; line-height:30px; font-weight:600;} .studyBrown .inner .studyFrame .blueRound p {padding-top:20px; font-size:20px; color:#000; line-height:30px; font-weight:400;} .studyBrown .inner .studyFrame .blueRound::after {position: absolute; top:0; right:5px; width:1px; height:100px; background:#f4cea2;} .studyBrown .inner h3 {color:#0a1e3c; font-size:24px; font-weight:600; padding-top:80px; padding-bottom:20px;} @media(max-width:768px){ .mapBrown .txtWrap {text-align:center;} .mapGray {padding-top:40px; padding-bottom:50px; padding-left:25px; padding-right:25px;} .mapGray .inner h2 {font-size:20px; color:#0a1e3c; font-weight:700; padding-bottom:20px;} .mapGray .inner h3 {font-size:20px; color:#0a1e3c; font-weight:700; padding-bottom:10px;} .mapGray .inner h4 {font-size:15px; color:#242424; font-weight:400; line-height:22px; padding-bottom:10px;} .mapGray .inner p.f19 {padding-top:10px; font-size:14px; color:#0a1e3c; font-weight:400; padding-bottom:10px;} .mapGray .inner p {font-size:17px;} .mapGray .inner .BrowntxtWrap h1 {padding-top:30px;font-size:20px; text-align:center;} .mapGray .inner .BrowntxtWrap p {font-size:15px; line-height:20px; padding:20px 0px 30px 0px; text-align:center;} .mapGray .innerB {padding:30px 10px;} .mapGray .innerB h2 {font-size:22px; padding-bottom:15px;} .mapGray .innerB h3 {font-size:20px;padding-bottom:15px;} .mapGray .innerB p {font-size:14px; line-height:22px;} .locationTit {text-align:center; padding-left:25px; padding-right:25px; padding-bottom:15px;} .locationTit img {height:30px;} .mapBig h2 {font-size:22px; padding-bottom:20px;} .mapBig p.sm {text-align:left; padding-top:10px;font-size: 12px; font-weight: 400; line-height:18px;color: #717176; letter-spacing: -0.04em} .mapBig p.white {text-align:center; font-size: 17px; font-weight: 400; line-height:24px; padding-bottom:10px; color: #fff; letter-spacing: -0.04em} .studyBrown {padding:30px 25px; margin:0 auto; text-align:center;} .studyBrown .inner p {font-size:20px;} .studyBrown .inner h2 {color:#0a1e3c; font-size:22px; font-weight:600;} .studyBrown .inner .studyFrame {padding:30px 0px;} .studyBrown .inner .studyFrame h2 {font-size:18px; font-weight:500; line-height:24px;} .studyBrown .inner .studyFrame .blueRound h2 {width:120px; height:120px; font-size:18px; color:#dda361; line-height:22px; font-weight:600;} .studyBrown .inner .studyFrame .blueRound p {padding-top:10px; font-size:15px; color:#000; line-height:20px; font-weight:400;} .studyBrown .inner h3 {color:#0a1e3c; font-size:20px; font-weight:600; padding-top:30px; padding-bottom:20px;} } .titBig {overflow:hidden;max-width:1250px; width:100%; position:relative; padding-bottom:50px; margin:0 auto; text-align:center;} .titBig p {font-size:19px; color:#3e3e3e; font-weight:400; line-height:40px;} .titBig h2 {font-size:27px; color:#b8b8b8; font-weight:300;text-align:left;} @media(max-width:768px){ .titBig {padding-top:0px; padding-bottom:0px; } .titBig h2 {font-size:22px; padding-bottom:20px;} } .info4_area{overflow:hidden;max-width:1345px; width:100%; position:relative; padding-top:70px; padding-bottom:100px; margin:0 auto;} .info4_area .info4_areaWrap {overflow:hidden; width:100%;} .info4_area .info4_areaWrap h4 {font-size:26px; font-weight:600; color:#fff;padding-bottom:60px;} .info4_area .info4_areaWrap h3 {font-size:26px; font-weight:600; color:#fff;padding-bottom:20px;} .info4_area .info4_areaWrap .whiteList {padding:0px 0px 50px 0px; } .info4_area .info4_areaWrap .whiteList li {position: relative; font-size:19px; color:#fff; line-height:35px; padding-left:15px;} .info4_area .info4_areaWrap .whiteList li::before {content: '+'; position: absolute; top: 0; left: 0; padding-left:0px;} .info4_area .info4_areaWrap .leftWrap {float:left;width:34%;padding-top:0px; text-align:center;} .info4_area .info4_areaWrap .leftWrap img {max-width:100%;} .info4_area .info4_areaWrap .leftWrap h2 {color:#d2b898; font-size:58px; letter-spacing:15px; padding-bottom:20px;} .info4_area .info4_areaWrap .leftWrap .bar {width:100%; height:1px; background:#fff;} .info4_area .info4_areaWrap .leftWrap p {padding-top:20px;color:#fff; font-size:35px; font-weight:200; line-height:40px; text-align:center;} .info4_area .info4_areaWrap .leftWrap p.strong {font-size:35px; font-weight:600; letter-spacing:7px; line-height:40px; text-align:center;} .info4_area .info4_areaWrap .rightWrap {float:left;width:63%; margin-left:3%; text-align:left;padding:0px 0px 0px 0px;box-sizing: border-box;} .info4_area .info4_areaWrap .rightWrap p {font-size:18px; color:#616161; font-weight:400;line-height:40px;} .info4_area .info4_areaWrap .rightWrap p span {font-size:23px; font-weight:700;} .info4_area .info4_areaWrap .rightWrap .lifeWrap {width:100%; padding:0px 0px 10px;clear:both;} .info4_area .info4_areaWrap .rightWrap .lifeWrap h4 {font-size:26px; font-weight:600; color:#b07b66;padding-bottom:40px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt {position:relative; display:block; overflow:hidden; width:100%; padding-bottom:15px; text-align:left; clear:both;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .roundTit {width:12%; float:left; } .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .roundTit p {width:65px; height:65px; line-height:65px; text-align:center;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .textInfo {float:left; width:84%; padding-top:10px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .textInfo2 {float:left; width:84%;padding-top:5px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt h2 {text-align:left; font-size:20px; color:#343434; font-weight:600;padding-bottom:5px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt li {position: relative;font-size:16px; color:#0a1e3c; line-height:25px; padding-bottom:13px; font-weight:400;} /* .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt {padding-bottom:40px; text-align:left; float:left;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt h2 {text-align:left; font-size:21px; color:#fff; font-weight:700;padding-bottom:15px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt li {position: relative;font-size:17px; color:#fff; line-height:26px; padding-bottom:13px; padding-left:14px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt li:before {content: '+'; position: absolute; top: 1px; left: 0} */ .info4_bottom {overflow:hidden; width:100%; overflow:hidden;} .bottomBlue {padding:50px 0px 100px; text-align:center; font-size:26px; color:#192c55; font-weight:600;} .bottomBlue span {position: relative; padding:0 20px;} @media(max-width:1200px){ .info4_area{padding-top:50px; margin-bottom:150px; margin:0 auto;} .info4_area .info4_areaWrap {padding-bottom:30px;} .info4_area .info4_areaWrap .leftWrap {float:left;width:30%;padding-bottom:30px;} .info4_area .info4_areaWrap .leftWrap h2 {font-size:48px; letter-spacing:15px; padding-bottom:20px;} .info4_area .info4_areaWrap .leftWrap .bar {margin:0 auto;width:30%; height:1px; background:#fff;} .info4_area .info4_areaWrap .leftWrap p {font-size:28px;line-height:30px;} .info4_area .info4_areaWrap .leftWrap p.strong {font-size:28px; line-height:30px;} .info4_area .info4_areaWrap .rightWrap {float:left;width:68%; margin-left:2%; padding:0px 0px 0px 0px;box-sizing: border-box;} .info4_area .info4_areaWrap .rightWrap .lifeWrap {margin:0 auto; width:100%; padding:0px 0px 0px;clear:both;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt {padding-left:0px; padding-bottom:10px; text-align:left; float:left;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .roundTit p {font-size:22px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .textInfo {padding-left:20px;padding-top:10px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .textInfo2 {padding-left:20px;padding-top:10px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt h2 {font-size:20px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt li {font-size:14px;line-height:20px;} } @media(max-width:900px){ .info4_area .info4_areaWrap .leftWrap {display:none;} .info4_area .info4_areaWrap .rightWrap {float:none;width:100%; margin-left:0%; margin:0 auto; text-align:center; box-sizing: border-box;} .info4_area .info4_areaWrap .rightWrap .lifeWrap {margin:0 auto;text-align:center; width:80%; } } @media(max-width:768px){ .info4_area{padding-bottom:0px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap {margin:0 auto;text-align:center; width:100%; } .info4_area .info4_areaWrap .rightWrap .lifeWrap h4 {font-size:20px; font-weight:600; color:#b07b66;padding-bottom:30px;} .info4_area .info4_areaWrap h4 {font-size:22px; font-weight:600; color:#fff;padding-bottom:30px;} .info4_area .info4_areaWrap h3 {font-size:20px; font-weight:600; color:#fff;padding-bottom:10px;} .info4_area .info4_areaWrap .whiteList {padding:0px 0px 30px 0px; } .info4_area .info4_areaWrap .whiteList li {position: relative; font-size:15px; color:#fff; line-height:35px; padding-left:15px;text-align:left;} .info4_area .info4_areaWrap .whiteList li::before {content: '+'; position: absolute; top: 0; left: 0; padding-left:0px;} .bottomBlue {padding:30px 0px 50px; text-align:center; font-size:20px; color:#192c55; font-weight:600;} .bottomBlue span {position: relative; padding:0 10px;} } @media (max-width: 479px) { .info4_area{padding-top:30px; margin-bottom:50px; margin:0 auto;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .roundTit {width:18%; margin-right:2%;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .roundTit p {width:80px; height:80px;font-size:17px; line-height:80px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .textInfo {width:80%; padding-left:10px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .textInfo2 {width:80%; padding-left:10px;} .mapBig {overflow:hidden; width:100%; position:relative; padding-top:0px; padding-bottom:0px; margin:0 auto; text-align:center;} .mapBig p.sm {text-align:left; padding-top:10px;font-size: 10px; font-weight: 400; line-height:18px;color: #717176; letter-spacing: -0.04em} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt h2 {font-size:17px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt li {font-size:12px;line-height:17px;} } @media (max-width: 350px) { .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .roundTit {width:18%; margin-right:2%;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .roundTit p {width:70px; height:70px;font-size:17px; line-height:70px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .textInfo {width:80%; padding-left:10px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt .textInfo2 {width:80%; padding-left:10px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt h2 {font-size:16px;line-height:20px;padding-bottom:7px;} .info4_area .info4_areaWrap .rightWrap .lifeWrap .leftTxt li {font-size:12px;line-height:18px;} } .titWrap {text-align:center; padding-bottom:50px;} .titWrap h1.h1tit {font-size: 36px;font-weight: 700;color:#000000;} .titWrap h2.h2num {margin-top: 0px; font-size: 150px;font-weight: 900; color:#000000;} .titWrap p {font-size:19px; color:#3e3e3e; font-weight:400; line-height:40px;} @media(max-width:768px){ .titWrap h1.h1tit {font-size: 22px;} .titWrap h2.h2num {font-size:80px;} .titWrap p {font-size:17px;line-height:24px;} .titWrap p:nth-child(2) {padding-top:20px;} } .premiumWrap {} .premiumWrap .premium-boxBlue {position: relative;width:100%; overflow:hidden; margin-bottom:40px;background:#000000 url(/design/default/images/sub/premium_bg1.jpg) no-repeat;} .premiumWrap .premium-boxBlue .num_Blue {} .premiumWrap .premium-boxBlue .num_Blue .premium_Img {float:left; width:300px;} .premiumWrap .premium-boxBlue .num_Blue .num {float:left;width:200px;padding-top:60px;text-align:center; } .premiumWrap .premium-boxBlue .num_Blue .premium_Txt {float:left;padding-top:60px;text-align:left;} .premiumWrap .premium-boxBlue .num_Blue .premium_Txt p.title {font-size:28px; color:#ffe100; font-weight:700;padding-bottom:10px;letter-spacing:-1;} .premiumWrap .premium-boxBlue .num_Blue .premium_Txt p {text-align:left;font-size:17px; color:#fff; line-height:30px; font-weight:400;} .premiumWrap .premium-boxBlue .icon {position: absolute; top:50%; transform: translateY(-50%); right:40px;} .premiumWrap .premium-boxIvory {position: relative;width:100%; overflow:hidden; margin-bottom:40px;background:#11114d url(/design/default/images/sub/premium_bg2.jpg) no-repeat;} .premiumWrap .premium-boxIvory .num_Ivory {} .premiumWrap .premium-boxIvory .num_Ivory .premium_Img {float:left; width:300px;} .premiumWrap .premium-boxIvory .num_Ivory .num {float:left;width:200px;padding-top:60px;text-align:center; } .premiumWrap .premium-boxIvory .num_Ivory .premium_Txt {float:left;padding-top:60px;} .premiumWrap .premium-boxIvory .num_Ivory .premium_Txt p.title {font-size:28px; color:#ffe100; font-weight:700;padding-bottom:10px;letter-spacing:-1;} .premiumWrap .premium-boxIvory .num_Ivory .premium_Txt p {text-align:left;font-size:17px; color:#fff; line-height:30px; font-weight:400;} .premiumWrap .premium-boxIvory .icon {position: absolute; top:50%; transform: translateY(-50%); right:40px;} .premiumWrap .last {margin-bottom:20px;} .premiumWrap h2 {font-size:30px; color:#27265a; font-weight:400; padding-bottom:10px;text-align:center;} .premiumWrap h3 {font-size:28px; color:#7a613e; font-weight:700; padding-top:50px; padding-bottom:20px;text-align:center;} .premiumWrap p {font-size:19px; color:#454545; font-weight:400;text-align:center;} @media(max-width:768px){ .premiumWrap .premium-boxBlue .num_Blue .premium_Txt p.title {font-size:20px;} .premiumWrap .premium-boxBlue .num_Blue .premium_Txt p {text-align:left;font-size:13px; line-height:20px; font-weight:400;} } #autoCard2 .col2 {text-align:center; font-size:19px; color:#454545;} #autoCard2 .col2 .box1 {width:100%; background:#27265a; color:#fff; font-size:24px; padding:10px 0px; font-weight:700;margin-top:15px;} #autoCard2 .col2 .box2 {width:100%; background:#403e90; color:#fff; font-size:24px; padding:10px 0px; font-weight:700;margin-top:15px;} .premiumWrap .pd30 {padding:30px 0px;} @media(max-width:768px){ .h1num { margin-top: 0px; font-size: 80px; font-weight: 900; text-align:center; color:#000000; } .premiumWrap .premium-boxBlue .num_Blue .premium_Img {float:none; width:100%; text-align:center;} .premiumWrap .premium-boxBlue .num_Blue .num {float:none;width:100%;padding-top:25px;text-align:center; } .premiumWrap .premium-boxBlue .num_Blue .num img {width:100px;} .premiumWrap .premium-boxBlue .num_Blue .premium_Txt {float:none;padding:0px 10px 20px 10px;} .premiumWrap .premium-boxBlue .num_Blue .premium_Txt p.title {font-size:22px; color:#d2b89a; font-weight:700;padding-bottom:10px;} .premiumWrap .premium-boxBlue .num_Blue .premium_Txt p {font-size:15px; color:#e6e6e6; line-height:24px; font-weight:400;text-align:center;} .premiumWrap .premium-boxBlue .num_Blue .premium_Txt p br {display:none;} .premiumWrap .premium-boxBlue .icon {display:none;} .premiumWrap .premium-boxIvory .num_Ivory .premium_Img {float:none; width:100%; text-align:center;} .premiumWrap .premium-boxIvory .num_Ivory .num {float:none;width:100%;padding-top:25px;text-align:center;} .premiumWrap .premium-boxIvory .num_Ivory .num img {width:100px;} .premiumWrap .premium-boxIvory .num_Ivory .premium_Txt {float:none;padding:0px 10px 20px 10px;} .premiumWrap .premium-boxIvory .num_Ivory .premium_Txt p.title {font-size:22px; font-weight:700;padding-bottom:10px;} .premiumWrap .premium-boxIvory .num_Ivory .premium_Txt p {font-size:15px; line-height:24px; font-weight:400;text-align:center;} .premiumWrap .premium-boxIvory .num_Ivory .premium_Txt p br {display:none;} .premiumWrap .premium-boxIvory .icon {display:none;} .premiumWrap h2 {font-size:22px; color:#27265a; font-weight:400; padding-bottom:10px;text-align:center;} .premiumWrap h3 {font-size:22px; color:#7a613e; font-weight:700; padding-top:50px; padding-bottom:20px;text-align:center;} .premiumWrap p {font-size:16px; color:#454545; font-weight:400;text-align:center; padding-bottom:30px;} #autoCard2 .col2 {text-align:center; font-size:19px; color:#454545; font-weight:500;} #autoCard2 .col2 .box1 {width:100%; background:#27265a; color:#fff; font-size:20px; padding:5px 0px; font-weight:700;margin-top:8px;} #autoCard2 .col2 .box2 {width:100%; background:#403e90; color:#fff; font-size:20px; padding:5px 0px; font-weight:700;margin-top:8px;} } .floorWrap {width:100%; max-width:1400px; overflow:hidden; padding-bottom:100px;} .floorWrap .step {/* background:#b07b66; */ display: flex; align-items:center;} .floorWrap .step .typeP {position: relative; width:380px; height:220px; background:#192c55; font-size:120px; line-height:220px; font-weight:700; text-align:center; color:#fff;} .floorWrap .step .typeP p {position: absolute; top:20px; left:20px; font-size:20px; line-height:20px; font-weight:400; color:#fff;} .floorWrap .step .typeInfo {margin-left:10px; background:#b9966e; position: relative; width:100%; height:90px; font-size:26px; font-weight:500; /*color:#a1a1a1;*/ color:#fff; padding-left:40px; line-height:90px;text-align:left;} .floorWrap .step .typeInfo p {background:#0a1e3c; width:200px; height:90px; position: absolute; top:0px; right:0px; font-size:20px; line-height:90px; font-weight:400; color:#fff;text-align:center;} .floorWrap .col2 {max-width:1400px; width:100%; padding:0px 0px;/*padding:40px 0px;*/} .floorWrap .col2 li {float:left;} .floorWrap .col2 li.table {padding-top:350px; width:380px; text-align:left;} .floorWrap .col2 li.table img {padding-bottom:200px;} .floorWrap .col2 li.typeImg {float:right;max-width:1000px; width:100%; text-align:center; margin:0 auto;} .floor-tbl{width:100%; box-sizing:border-box;border-top:0px solid #898989; margin-bottom:10px;} .floor-tbl th {background:#d1cbd3;} .floor-tbl th, .floor-tbl td{font-family:'Noto Sans KR',sans-serif; font-size:14px; line-height:1.2em; padding:10px 0px; font-weight:400;text-align:center;border-bottom:0px solid #898989;} .floor-tbl tr th{color:#3b3b3b;} .floor-tbl th + th {border-right:1px solid #fff; border-left:1px solid #fff;} .floor-tbl td + td {border-left:none;} .floor-tbl tr td.gray{background:#f5f3f0;} @media(max-width:768px){ .floorWrap {padding-bottom:30px; } .floorWrap .step {padding-bottom:0px;display: block; } .floorWrap .step .typeP {width:100%; height:70px; font-size:30px; line-height:70px; padding-right:0px;} .floorWrap .step .typeP p {top:5px; left:10px; font-size:13px;} .floorWrap .step .typeInfo {margin-left:0px;font-size:13px;padding-left:10px;height:40px;line-height:40px;} .floorWrap .step .typeInfo p {width:80px; top:0px; right:0px; height:40px; font-size:12px; line-height:40px; font-weight:400; color:#fff;text-align:center;} .floorWrap .step .typeInfo p br {display:none;} .floorWrap .col2 {padding:20px 0px 0px; text-align:center;} .floorWrap .col2 li {float:none; width:100%; text-align:center; padding:0px 0px;} .floorWrap .col2 li.table {padding-top:0px; text-align:center; margin:0 auto;} .floorWrap .col2 li.table img {padding-bottom:20px;} .floorWrap .col2 li.pt115 {padding-top:0px;} .floorWrap .col2 li.pt250 {padding-top:0px;} .floorWrap .col2 li img {padding-bottom:20px;} .floor-tbl {width:100%; margin:0 auto; margin-bottom:10px;} .floor-tbl th, .floor-tbl td{font-size:11px;} } /* 관심고객등록 */ /* �쇰컲寃뚯떆�� 由ъ뒪�� */ .ntb-tb {border-top:2px solid #808080;} .ntb-tb caption {visibility:hidden;} .ntb-tb th {padding:10px; border-bottom: 1px solid #ddd; border-right: 1px solid #ddd; text-align:center; font-weight: bold; color:#333; line-height:18px;} .ntb-tb td {padding:10px; border-bottom:1px solid #ddd; text-align:center; vertical-align:middle; line-height:18px; word-break:break-all;} .ntb-tb .left {text-align:left; padding-left:10px;} .ntb-tb .right {text-align:right; padding-left:10px;} .ntb-tb .r_none {border-right:none;} .ntb-tb .font_category {font-weight:bold; color:#0080d3; font-size: 11px;} .ntb-tb .font_comment {font-weight: bold; font-size: 11px; color: #ee2ea9;} .ntb-tb .font_search {font-weight:bold; color:#CC3300} /* �⑤씪�� 臾몄쓽 */ .formBg {padding:20px 0px; max-width:900px; width:100%;} .inquiry_com{width:100%; margin:0 auto;} .inquiry_com .con_wrap{} .inquiry_com .con_wrap .tit{ border-bottom:1px solid #0068b7; margin-bottom:20px;} .inquiry_com .con_wrap .tit p{ font-size:35px; color: #0068b7; font-family:'Exo'; letter-spacing:-0.03em; font-weight:700; padding-bottom:17px; text-transform:uppercase;} .inquiry_com .con_wrap .formBox{} .inquiry_com .con_wrap .formBox section{} .inquiry_com .con_wrap .formBox section:nth-of-type(n+2){ margin-top:38px;} .inquiry_com .con_wrap .formBox section .box{} .inquiry_com .con_wrap .formBox section .box:after{ display: block; content:''; clear:both;} .inquiry_com .con_wrap .formBox section.section1 .box .type{ font-size:15px; border-bottom:1px solid #e0e0e0; padding: 18px 0 8px 0;} .inquiry_com .con_wrap .formBox section.section1 .box:nth-of-type(n+2) .type{ float: left; width: 47.85714285714%; margin-right:4.28571428571%; box-sizing:border-box;} .inquiry_com .con_wrap .formBox section.section1 .box:nth-of-type(n+2) .type:nth-of-type(2){ margin-right:0;} .inquiry_com .con_wrap .formBox section.section1 .box .w_max {width:100% !important} .inquiry_com .con_wrap .formBox section.section1 .box .type > *{ display: inline-block; vertical-align:middle; box-sizing:border-box;} .inquiry_com .con_wrap .formBox section .box .type .type_tit{ font-size:15px; color: #000; box-sizing:border-box; padding-left:8px;} .inquiry_com .con_wrap .formBox section.section1 .box .type .type_tit{ width: 130px; } .inquiry_com .con_wrap .formBox section:nth-of-type(n+2) .box .type .type_tit{ margin-bottom:17px;} .inquiry_com .con_wrap .formBox section .box .type .type_tit em{ color: #ff0000;} .inquiry_com .con_wrap .formBox section.section1 .box .type input{ /* width: 400px; */ padding-left:10px; height: 30px; border:none;} .inquiry_com .con_wrap .formBox section.section1 .box .type input.radio {width: 80px; } .inquiry_com .con_wrap .formBox section.section1 .box .type label {padding:0px 15px 0px 5px;} .inquiry_com .con_wrap .formBox section.section1 .box .type select {font-size:15px; border:1px solid #e0e0e0; padding:5px 10px;} .inquiry_com .con_wrap .formBox section .box .type input::placeholder, .inquiry_com .con_wrap .formBox section.section2 .box .type textarea::placeholder, .inquiry_com .con_wrap .formBox section.section4 .box2 input[type='text']{ color: rgba(51,51,51,0.4);} .inquiry_com .con_wrap .formBox section.section2 .box .type{} .inquiry_com .con_wrap .formBox section .box .type textarea{ width: 100%; resize:none; border:1px solid #e0e0e0; box-sizing:border-box; padding: 20px; font-size:15px;} .inquiry_com .con_wrap .formBox section.section2 .box .type textarea{ resize:vertical; height: 150px;} .inquiry_com .con_wrap .formBox section.section3 .box .type textarea{ height: 200px; color: rgba(51,51,51,0.4); font-size:15px; line-height:1.7; padding:20px; } .inquiry_com .con_wrap .formBox section.section3 .box .type .checkBox{ padding: 10px 24px;} .inquiry_com .con_wrap .formBox section.section3 .box .type .checkBox label{ font-size:14px; color: #666; font-weight:300; cursor:pointer;} .inquiry_com .con_wrap .formBox section.section3 .box .type .checkBox label em{ color: #0068b7;} .inquiry_com .con_wrap .formBox section.section4:after{ display: block; content:''; clear:both;} .inquiry_com .con_wrap .formBox section.section4 > *{ position: relative; float: left; width: 47.85714285714%; margin-right:4.28571428571%; box-sizing:border-box; border-bottom:1px solid #e0e0e0; padding: 28px 0 8px 0;} .inquiry_com .con_wrap .formBox section.section4 .box:nth-of-type(n+2) .type:nth-of-type(2){ margin-right:0;} .inquiry_com .con_wrap .formBox section.section4 .box .type > *{ display: inline-block; vertical-align:middle; } .inquiry_com .con_wrap .formBox section.section4 .box .type .type_tit{ margin-bottom:0;} .inquiry_com .con_wrap .formBox section.section4 .box .type{ font-size:0;} .inquiry_com .con_wrap .formBox section.section4 .box1 .type .type_tit{ width: 100px;} .inquiry_com .con_wrap .formBox section.section4 .box2 .type .type_tit{ width: 147px;} .inquiry_com .con_wrap .formBox section.section4 .box .type .content > *{ display: inline-block; vertical-align:middle;} .inquiry_com .con_wrap .formBox section.section4 .box1 .type .content{ width: calc(100% - 104px);} .inquiry_com .con_wrap .formBox section.section4 .box2 .type .content{ width: calc(100% - 147px);} .inquiry_com .con_wrap .formBox section.section4 .box1 .type .content input[type="text"]{ height: 38px; box-sizing:border-box; border:none; width: calc(100% - 80px); background-color: #fff;} .inquiry_com .con_wrap .formBox section.section4 .box1 input[type='file']{ /* �뚯씪 �꾨뱶 �④린湲� */ position: absolute !important; width: 0px; height: 0px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0; } .inquiry_com .con_wrap .formBox section.section4 .box1 label{ display: inline-block; width: 80px; background-color: #444343; color: rgba(255,255,255,0.8); text-align:center; padding: 10px 0; border-radius:2px; cursor:pointer; font-size:14px;} .inquiry_com .con_wrap .formBox section.section4 .box2{ margin-right:0;} .inquiry_com .con_wrap .formBox section.section4 .box2 button{ width: 80px; background-color: #444343; color: rgba(255,255,255,0.8); text-align:center; padding: 7px 0; border-radius:2px; cursor:pointer; border:none; margin: 0 10px; font-size:14px;} .inquiry_com .con_wrap .formBox section.section4 .box2 input[type='text']{ width: calc(100% - 230px); height: 35px; border:1px solid #e0e0e0; box-sizing:border-box; padding-left:10px;} .btn_com {width:100%; overflow:hidden; padding-top:50px;} .btn_com li {width:50%; float:left;} .btn_com li.send {text-align:right; padding-right:30px;} .btn_com li.kakao {text-align:center; padding-left:30px;} .btn_com li.send input[type=submit]{float:right; position: relative; display: block; font-size:15px; color: #fff; font-family:'Exo'; background-color: #444343; width: 180px; padding: 15px 0; text-align:center;text-transform:uppercase; border: 0; margin-bottom:20px;} .btn_com li.send input:hover {background-color:#b07b66; color:#fff;} .btn_com li.kakao .kakao_btn {width:180px; height:52px; line-height:50px; font-size:15px; text-align:center; background:#ffd21f;} @media screen and (max-width:500px){ .btn_com {padding-top:20px; padding-bottom:50px;} .btn_com li.send {padding-right:5px;} .btn_com li.kakao {padding-left:5px;} .btn_com li.send input[type=submit]{font-size:13px; color: #fff; font-family:'Exo'; background-color: #444343; width: 130px; padding: 12px 0; text-align:center;text-transform:uppercase; border: 0; margin-bottom:20px;} .btn_com li.kakao .kakao_btn {width:130px; height:43px; font-size:13px; line-height:43px; text-align:center; background:#ffd21f;} } .wrap-input100 textarea {padding:20px 10px; font-size:14px; color:#646464; border-top:0px solid #d9d9d9;border-bottom:0px solid #d9d9d9; border-left:none; border-right:none;} @media screen and (max-width:1024px){ .inquiry_com .con_wrap .formBox section.section4 .box { float: none; width: 100%;} } @media screen and (max-width:768px){ .inquiry_com .con_wrap .tit{ margin-bottom:0;} .inquiry_com .con_wrap .tit p{ font-size:28px;} .inquiry_com .con_wrap .formBox section.section1 .box .type{font-size:12px; padding: 10px 0;} .inquiry_com .con_wrap .formBox section.section1 .box:nth-of-type(n+2) .type{ float: none; width: 100%;} .inquiry_com .con_wrap .formBox section .box .type .type_tit{ font-size:13px;} .inquiry_com .con_wrap .formBox section.section1 .box .type .type_tit{ width: 85px;} .inquiry_com .con_wrap .formBox section.section1 .box .type input{font-size:12px; } /* .inquiry_com .con_wrap .formBox section.section1 .box .type input{ width: calc(100% - 85px);} */ .inquiry_com .con_wrap .formBox section.section2 .box .type textarea{ height: 150px;} .inquiry_com .con_wrap .formBox section.section4 .box2 .type .type_tit{ width: 105px;} .inquiry_com .con_wrap .formBox section.section4 .box2 .type .content{ width: calc(100% - 105px);} .inquiry_com .con_wrap .formBox section.section4 .box2 button{ width: 60px; font-size:13px;} .inquiry_com .con_wrap .formBox section.section4 .box2 input[type='text']{ width:calc(100% - 185px)} .inquiry_com .con_wrap .formBox section .box .type textarea{ padding: 10px; font-size:12px;} .inquiry_com .con_wrap .formBox section.section3 .box .type textarea{ height: 150px;font-size:12px; line-height:15px; padding:10px; } .wrap-input100 textarea {padding:20px 10px; font-size:12px; color:#646464; border-top:2px solid #d9d9d9;border-bottom:2px solid #d9d9d9; border-left:none; border-right:none;} } @media screen and (max-width:900px){ .pcBasic {display:none;} .mobile {display:block !important;} br.pc {display:none;} br.mo {display:block !important;} br.all {display:block !important;} .swiper-slide p span {display:none;} } @media screen and (min-width:901px){ .pcBasic {display:block !important;} .mobile {display:none;} br.pc {display:block !important;} br.mo {display:none;} br.all {display:block !important;} } /***** 공통 간격 *****/ .pdt10 {padding-top:10px;} .pdt30 {padding-top:30px;} .pdt50 {padding-top:50px;} .pdt80 {padding-top:80px;} .pdb10 {padding-top:10px;} .pdb30 {padding-bottom:30px;} .pdb50 {padding-bottom:50px;} .pdb70 {padding-bottom:70px;} .pdb100 {padding-bottom:100px;} .mt17 {margin-top:17px;} .mt30 {margin-top:30px;} .mt100 {margin-top:100px;} .mb17 {margin-bottom:17px;} .mLR10 {margin-left:10px; margin-right:10px;} @media screen and (max-width:768px){ .pdt30 {padding-top:10px;} .pdt50 {padding-top:30px;} .pdt80 {padding-top:40px;} .pdb50 {padding-bottom:30px;} } /***** 서브페이지 타이틀 *****/ .subpageTit {text-align:center;} .subpageTit h2 {font-size:29px; color:#0a1e3c; font-weight:500;padding-bottom:65px;} .subpageTit h2.small {font-size:22px; color:#6d6d6d; font-weight:300; padding-top:20px; padding-bottom:30px;} .subpageTit p {font-size:25px; color:#b9966e; font-weight:400;} .subpageTit p.bold {font-weight:700;padding-bottom:30px;} .subpageTit p.blue {font-size:26px; color:#192c55; font-weight:600;} @media screen and (max-width:768px){ .subpageTit h2 {font-size:24px; color:#5d5d5d; font-weight:400;padding-bottom:35px;} .subpageTit h2.small {font-size:18px; color:#6d6d6d; font-weight:300; padding-top:10px; padding-bottom:15px;} .subpageTit p {font-size:16px; color:#b07b66; font-weight:400;padding-bottom:15px;} .subpageTit p.blue {font-size:18px; color:#192c55; font-weight:600;} } /***** 서브페이지 이미지 *****/ .subpageImg {text-align:left;} .subpageImg p.right {font-size:20px; color:#6d6d6d; text-align:right; font-weight:400;} @media screen and (max-width:768px){ .subpageTit p {} .subpageImg p.right {padding-top:20px; font-size:18px; color:#6d6d6d; text-align:center; font-weight:400;} } /***** 브랜드스토리 *****/ .brand_story {padding:70px 0px; margin-top:0px; /*margin-top:55px; */background:#0a1e3c;} .brand_story .inner {width:100%; max-width:1400px; margin:0 auto;} .brand_story .inner h1 {font-size:29px; color:#fff; font-weight:500; line-height:35px;} .brand_story .inner h2 {font-size:22px; color:#fff; font-weight:300; line-height:35px;} .brand_story .inner .blueFrame {display: inline-block; padding-top:0px; margin-bottom:100px;} .brand_story .inner .blueFrame .Left80 {padding-left:80px;} .brand_story .inner .blueFrame .txtWrap {padding-top:0px;} .brand_story .inner .blueFrame .txtWrap h1 {font-size:29px; color:#b9966e; font-weight:600; line-height:35px; padding-bottom:35px;} .brand_story .inner .blueFrame .txtWrap h2 {font-size:24px; color:#fff; font-weight:600; line-height:35px;} .brand_story .inner .blueFrame .txtWrap h3 {font-size:20px; color:#b9966e; line-height:28px; padding:50px 0px;} .brand_story .inner .blueFrame .txtWrap h4 {font-size:22px; color:#fff; line-height:28px; font-weight:500;} .brand_story .inner .blueFrame .txtWrap p {font-size:17px; color:#fff; line-height:35px;} .brand_story .inner .blueFrame .txtWrap .brownList {padding-top:40px;} .brand_story .inner .blueFrame .txtWrap .brownList p.titBrown {font-size:22px; color:#b9966e; line-height:30px; padding-bottom:5px;} .brand_story .inner .blueFrame .txtWrap .brownList p {font-size:17px; color:#fff; line-height:30px;} .brand_story .inner .blueFrame .textWrap {padding-top:50px; text-align:center; font-size:23px; color:#b9966e; font-weight:700;} .brand_story .inner .blueFrame .browntxtWrap {background:#b9966e; padding:20px 40px; } .brand_story .inner .blueFrame .browntxtWrap li {position: relative; font-size:20px; color:#0a1e3c; line-height:30px; padding-left:35px;} .brand_story .inner .blueFrame .browntxtWrap li::before {content: '+'; position: absolute; top: 0; left: 0; padding-left:15px;} .brand_story .inner .blueFrame .whiteList {padding:0px 0px 50px 0px; } .brand_story .inner .blueFrame .whiteList li {position: relative; font-size:18px; color:#fff; line-height:45px; padding-left:25px;} .brand_story .inner .blueFrame .whiteList li::before {content: '+'; position: absolute; top: 0; left: 0; padding-left:5px;} .brand_story .boxLogo {position: absolute; width:280px; height:280px; background:#b07b66; top:-140px; left: 50%; transform: translateX(-50%);text-align:center;padding:80px 0;} .brand_story .boxTxt {position: absolute; top:50%; left: 50%; transform: translate(-50%, -50%);} .brand_story .blueFrame .inner .txtWrap {padding-top:0px;;} .brand_story .blueFrame .inner .txtWrap h1 {font-size:29px; color:#b9966e; font-weight:600; line-height:35px; padding-bottom:35px;} .brand_story .blueFrame .inner .txtWrap h2 {font-size:24px; color:#fff; font-weight:600; line-height:35px;} .brand_story .blueFrame .inner .txtWrap h3 {font-size:20px; color:#b9966e; line-height:28px; padding:50px 0px;} .brand_story .blueFrame .inner .txtWrap h4 {font-size:22px; color:#fff; line-height:28px; font-weight:500; padding-bottom:25px;} .brand_story .blueFrame .inner .txtWrap p {font-size:17px; color:#fff; line-height:35px;} .brand_story .blueFrame .inner .browntxtWrap {background:#b9966e; padding:20px 40px; } .brand_story .blueFrame .inner .browntxtWrap li {position: relative; font-size:20px; color:#0a1e3c; line-height:30px; padding-left:35px;} .brand_story .blueFrame .inner .browntxtWrap li::before {content: '+'; position: absolute; top: 0; left: 0; padding-left:15px;} .brand_story .inner .centerWrap {text-align:center;} .brand_story .inner .centerWrap h1 {font-size:29px; color:#b9966e; font-weight:700; padding-bottom:30px;} .brand_story .inner .centerWrap h2 {font-size:24px; color:#b9966e; font-size:300; padding-bottom:10px;} .brand_story .inner .centerWrap p {font-size:22px; color:#fff;} @media screen and (max-width:1200px){ .brand_story {padding-left:25px; padding-right:25px; padding-bottom:0px; height:635px;} .brand_story .boxLogo {position: absolute; width:200px; height:200px; background:#b07b66; top:-140px; left: 50%; transform: translateX(-50%);text-align:center;padding:50px 20px;} } @media screen and (max-width:768px){ .brand_story {padding:30px 25px;margin-top:0px; height:auto;} .brand_story .inner h1 {font-size:22px; color:#fff; font-weight:500; line-height:30px; padding-bottom:10px;text-align:center;} .brand_story .inner h2 {font-size:17px; color:#fff; font-weight:300; line-height:24px;text-align:center;} .brand_story .inner .blueFrame {margin-bottom:30px;} .brand_story .inner .blueFrame .Left80 {padding-left:0px;} .brand_story .inner .blueFrame .txtWrap h1 {font-size:20px;line-height:28px; padding-bottom:15px;} .brand_story .inner .blueFrame .txtWrap h2 {font-size:21px; line-height:28px; padding-top:40px;} .brand_story .inner .blueFrame .txtWrap h3 {font-size:19px; line-height:24px; padding:30px 0px;} .brand_story .inner .blueFrame .txtWrap h4 {font-size:17px; color:#fff; line-height:22px; font-weight:500;} .brand_story .inner .blueFrame .txtWrap h4 br {display:none;} .brand_story .inner .blueFrame .txtWrap p {font-size:14px; color:#fff; line-height:28px;} .brand_story .inner .blueFrame .txtWrap .brownList {padding-top:25px;} .brand_story .inner .blueFrame .txtWrap .brownList:last-child {padding-bottom:25px;} .brand_story .inner .blueFrame .txtWrap .brownList p.titBrown {font-size:18px; color:#b9966e; line-height:24px; padding-bottom:5px;} .brand_story .inner .blueFrame .txtWrap .brownList p {font-size:14px; color:#fff; line-height:22px;} .brand_story .inner .blueFrame .txtWrap .brownList p br {display:none;} .brand_story .inner .blueFrame .whiteList {padding:0px 0px 30px 0px; } .brand_story .inner .blueFrame .whiteList li {position: relative; font-size:15px; color:#fff; line-height:24px; padding-left:35px; text-align:left;} .brand_story .inner .blueFrame .whiteList li::before {content: '+'; position: absolute; top: 0; left: 0; padding-left:15px;} .brand_story .inner .centerWrap h1 {font-size:22px; color:#b9966e; font-weight:700; padding-bottom:20px;} .brand_story .inner .centerWrap p {font-size:17px; color:#fff;} .brand_story .blueFrame .inner .txtWrap h1 {font-size:20px; line-height:26px; padding-bottom:25px;} .brand_story .blueFrame .inner .txtWrap h4 {font-size:17px; color:#fff; line-height:24px; font-weight:500; padding-bottom:15px;} .brand_story .blueFrame .inner .txtWrap p {font-size:14px; color:#fff; line-height:22px;} .brand_story .blueFrame .inner .browntxtWrap {padding:20px 20px; } .brand_story .blueFrame .inner .browntxtWrap li {position: relative; font-size:14px; color:#0a1e3c; line-height:22px; padding-left:25px; text-align:left;} .brand_story .blueFrame .inner .browntxtWrap li::before {content: '+'; position: absolute; top: 0; left: 0; padding-left:15px;} .brand_story .inner .centerWrap h2 {font-size:20px; padding-bottom:0px;} .brand_story .boxLogo {position: absolute; width:200px; height:200px; background:#b07b66; top:-100px; left: 50%; transform: translateX(-50%);text-align:center;padding:50px 20px;} } /***** 프리미엄 *****/ @import url(//fonts.googleapis.com/earlyaccess/nanummyeongjo.css); .premium_area {margin-top:30px; margin-bottom:100px; text-align:center;} .premium_area .blueBox {background:#192c55; padding:50px 30px; text-align:center; margin-left:0.5%; margin-right:0.5%;} .premium_area .bar {background:#6e4646; width:100%; height:1px; margin-top:30px; margin-bottom:30px;} .premium_area .blueBox p {font-size:19px; color:#fff; line-height:30px;} .premium_area .blueBox p img {padding:20px 0px;} .premium_area .blueBox h2 {font-family: 'Nanum Myeongjo', serif; font-size:38px; color:#b07b66; line-height:45px; font-weight:600;} .premium_area .blueBox p.white {font-size:25px; color:#fff; line-height:35px; font-weight:600;} .premium_area .blueBox h3 {font-size:23px; color:#b07b66; line-height:45px; font-weight:600;} @media screen and (max-width:768px){ .premium_area .blueBox h2 {font-size:24px;line-height:35px; font-weight:600;} .premium_area .blueBox p {font-size:16px;line-height:22px;} .premium_area .blueBox p.white {font-size:16px; color:#fff; line-height:22px; font-weight:600;} .premium_area .blueBox h3 {font-size:20px; color:#b07b66; line-height:40px; font-weight:600;} } .premium_area .brownBox {background:#b07b66; padding:50px 30px; text-align:center; margin-right:0.5%; margin-left:0.5%;} .premium_area .brownBox p {font-size:19px; color:#fff; line-height:30px;} .premium_area .brownBox p.white {font-size:25px; color:#fff; line-height:35px; font-weight:600;} .premium_area .brownBox h2 {font-family: 'Nanum Myeongjo', serif; font-size:38px; color:#192c55; line-height:45px; font-weight:600;} .premium_area .brownBox h3 {font-size:25px; color:#192c55; line-height:45px; font-weight:600;} @media screen and (max-width:768px){ .premium_area .brownBox h2 {font-size:24px;line-height:35px; font-weight:600;} .premium_area .brownBox p {font-size:16px;line-height:22px;} .premium_area .brownBox p.white {font-size:16px; color:#fff; line-height:22px; font-weight:600;} .premium_area .brownBox h3 {font-size:20px; color:#192c55; line-height:40px; font-weight:600;} } .premium_area .inner {margin:0 auto; max-width:1400px; width:100%;} .premium_area .textWrap {text-align:center; padding-top:40px; } .premium_area .textWrap h2 {padding-top:10px; font-size:24px; color:#3b3b3b; font-weight:700; line-height:30px;} .premium_area .textWrap p {font-size:19px; color:#5d5d5d;} .premiun_Gray {background:#efefef; padding:50px 0px; width:100%; } .premiun_Gray .inner {margin:0 auto; max-width:1400px; width:100%;} .premiun_Gray .inner .divide_2 {width:100%; max-width:1400px; margin:0 auto;} .premiun_Gray .inner .divide_2 li {width:100%;text-align:left;box-sizing: border-box; padding:10px 0px;} .premiun_Gray .inner .divide_2 li.icon1 {background:url(/design/default/images/sub/premium_icon1.png) no-repeat 10px;} .premiun_Gray .inner .divide_2 li.icon2 {background:url(/design/default/images/sub/premium_icon2.png) no-repeat 10px;} .premiun_Gray .inner .divide_2 li.icon3 {background:url(/design/default/images/sub/premium_icon3.png) no-repeat 10px;} .premiun_Gray .inner .divide_2 li.icon4 {background:url(/design/default/images/sub/premium_icon4.png) no-repeat 10px;} .premiun_Gray .inner .divide_2 li ul li {float:left;width:100%; padding-left:140px; margin-bottom:10px; box-sizing: border-box;} .premiun_Gray .inner .divide_2 li ul li p {font-size:17px; color:#000; font-weight:400;} .premiun_Gray .inner .divide_2 li ul li p.brown {font-family: 'Nanum Myeongjo', serif; font-size:28px; color:#b07b66; font-weight:600; line-height:40px;font-weight:600;} .premiun_Gray .inner .divide_2 li ul li p.green {font-size:23px; color:#2f8398; font-weight:500; line-height:40px;} .premiun_Gray .inner .divide_2 li.right p + p.big {padding-top:20px;} .blueBox2 {background:#192c55; padding:50px 30px; text-align:center; margin-top:25px; font-size:20px; line-height:30px; color:#b07b66;} .blueBox2 span {font-size:30px; font-weight:600;} @media screen and (max-width:768px){ .premium_area .textWrap p {font-size:16px;} .premiun_Gray {padding:30px 0px 20px; width:100%; } .premiun_Gray .inner .divide_2 li.icon1 {background:url(/design/default/images/sub/premium_icon1.png) no-repeat 0px 20px; background-size:60px;} .premiun_Gray .inner .divide_2 li.icon2 {background:url(/design/default/images/sub/premium_icon2.png) no-repeat 0px 20px; background-size:60px;} .premiun_Gray .inner .divide_2 li.icon3 {background:url(/design/default/images/sub/premium_icon3.png) no-repeat 0px 20px; background-size:60px;} .premiun_Gray .inner .divide_2 li.icon4 {background:url(/design/default/images/sub/premium_icon4.png) no-repeat 0px 20px; background-size:60px;} .premiun_Gray .inner .divide_2 li ul li {float:left;width:100%; padding-left:70px; font-size:13px; line-height:20px; margin-bottom:10px; box-sizing: border-box;} .premiun_Gray .inner .divide_2 li ul li p.brown {font-size:22px; color:#b07b66; font-weight:600; line-height:28px;font-weight:600;} .blueBox2 {padding:50px 30px; text-align:center; margin-top:15px; font-size:16px; line-height:26px; color:#b07b66;} .blueBox2 span {font-size:19px; font-weight:600;} } /***** 브랜드스토리 *****/ .brandStory {position: relative; margin-top:150px; width:100%; background:url(/design/default/images/sub/brandstory_bg.jpg) no-repeat; background-size: cover; background-attachment: fixed; text-align:center;} .brandStory .logoIcon {position: absolute; top:-100px; left: 50%; transform: translateX(-50%);text-align:center;} .brandStory .txtWrap {padding:205px 0px 100px 0px;} .brandStory .txtWrap p {font-size:22px; color:#fff; line-height:40px; padding-bottom:30px;} .brandStory .txtWrap h3 {font-size:26px; color:#004655; line-height:40px; font-weight:600; padding-bottom:30px;} .brandStory .txtWrap h2 {font-size:36px; color:#fff; line-height:40px; font-weight:600; padding-bottom:30px;} .brandStory_divide {overflow:hidden; max-width:1400px; width:100%; margin:0 auto; padding-bottom:50px;} .brandStory_divide .Big {float:left; width:65%; margin-bottom:15px;} .brandStory_divide .Small {overflow:hidden; float:left; width:34%; height:930px; margin-left:1%;box-sizing:border-box;} .brandStory_divide .Small .up {margin-bottom:15px; } .brandStory_divide .Small .down {background:#dee1e2; text-align:center; padding:70px 80px;} .brandStory_divide .Small .down p {font-size:23px; color:#303030; font-weight:500; padding:30px 0px;} .brandStory_divide .Small .down p.tit {font-size:30px; color:#004655; font-weight:600;} .brandStory_divide .bottom {margin-top:15px;} .brandStory_divide .bottom p {padding-top:10px;font-size: 12px; font-weight: 400; color: #717176; letter-spacing: -0.04em} @media screen and (max-width:1200px){ .brandStory_divide .Small {height:797px;} .brandStory_divide .Small .down {padding:30px 20px;} } @media screen and (max-width:900px){ .brandStory_divide .Small {height:597px;} .brandStory_divide .Small .down {padding:60px 20px;} .brandStory_divide .Small .down p {font-size:18px; color:#303030; font-weight:500; padding:10px 0px;} .brandStory_divide .Small .down p.tit {font-size:24px; color:#004655; font-weight:600;} } @media screen and (max-width:768px){ .brandStory .txtWrap {padding:120px 0px 80px 0px;} .brandStory .txtWrap p {font-size:18px; color:#fff; line-height:30px; padding-bottom:25px;} .brandStory .txtWrap h3 {font-size:20px; color:#004655; line-height:40px; font-weight:600; padding-bottom:30px;} .brandStory .txtWrap h2 {font-size:24px; color:#fff; line-height:40px; font-weight:600; padding-bottom:30px;} .brandStory_divide .Big {float:none; width:100%; margin-bottom:10px;} .brandStory_divide .Small {overflow:hidden; float:none; width:100%; height:auto; margin-left:0%;box-sizing:border-box;} .brandStory_divide .Small .up {float:left; width:50%; margin-bottom:0px; } .brandStory_divide .Small .down {float:left; width:50%; text-align:center; padding:90px 20px; height:377px; } .brandStory_divide .bottom {margin-top:10px;} } @media screen and (max-width:479px){ .brandStory_divide {padding:0 25px;} .brandStory .txtWrap p {font-size:14px; color:#fff; line-height:20px; padding-bottom:15px;} .brandStory .txtWrap h3 {font-size:17px; color:#004655; line-height:30px; font-weight:600; padding-bottom:20px;} .brandStory .txtWrap h2 {font-size:20px; color:#fff; line-height:30px; font-weight:600; padding-bottom:20px;} .brandStory_divide .Small .up {float:none; width:100%; margin-bottom:0px; } .brandStory_divide .Small .down {float:none; width:100%; text-align:center; padding:30px 0px; height:auto; } } .premium_divide {overflow:hidden; max-width:1400px; width:100%; margin:0 auto; padding-bottom:50px;} .gap {padding-bottom:100px;} .premium_divide .Big {float:left; overflow:hidden; width:45%; height:650px; margin-bottom:15px; box-sizing:border-box;} .premium_divide .Small {position: relative; overflow:hidden; float:left; width:54%; height:650px; margin-bottom:15px; box-sizing:border-box;} .premium_divide .mL1{margin-left:1%;} .premium_divide .Small .down {position: absolute; left:0; bottom:0; } .premium_divide .Small .up {text-align:left; padding:20px 0px;} .premium_divide .Small .up p {font-size:20px; line-height:35px; color:#000; font-weight:500; padding:16px 0px 20px;} .premium_divide .Small .up p strong {font-size:27px; font-weight:600; } .premium_divide .Small .up p.tit {font-size:24px; line-height:35px; color:#f390bb; font-weight:600;} .premium_divide .Small .up h1 {font-family:'Nanum Myeongjo', serif; font-size:40px; line-height:60px; color:#ed76aa; font-weight:600;} .premium_divide .Small .up .txtwrap {padding-top:30px;} .premium_divide .Small .up .txtwrap h2 {font-size:23px; line-height:35px; color:#000; font-weight:600;} .premium_divide .Small .up .txtwrap li {position: relative; font-size:17px; padding-left:10px; color:#000; line-height:40px;} /*.premium_divide .Small .up .txtwrap li::before{position:absolute;top:1px;left:0;content:'·'}*/ .premium_divide .Small .up .right {text-align:right;} @media screen and (max-width:1200px){ .premium_divide {padding:0px 25px 50px 25px;} } @media screen and (max-width:900px){ .premium_divide {padding:0 0px;} .premium_divide .Big {height:500px;} .premium_divide .Small {height:500px;} .premium_divide .Small .up p {font-size:18px; line-height:25px; color:#000; font-weight:500; padding:16px 0px 20px;} .premium_divide .Small .up p strong {font-size:22px; font-weight:600; } .premium_divide .Small .up p.tit {font-size:20px; line-height:25px; color:#f390bb; font-weight:600;} } @media screen and (max-width:479px){ .premium_divide .Big {width:100%; height:400px; margin-bottom:15px;} .premium_divide .Small {float:none; width:100%; height:400px; margin-bottom:15px;} .premium_divide .mL1{margin-left:0%;} .premium_divide .Small .down {float:none; width:100%;} .premium_divide .Small .up {float:none; width:100%; padding:20px 0px;} .premium_divide .Small .up p {font-size:15px; line-height:20px; color:#000; font-weight:500; padding:16px 0px 20px;} .premium_divide .Small .up p strong {font-size:18px; font-weight:600; } .premium_divide .Small .up p.tit {font-size:20px; line-height:25px; color:#f390bb; font-weight:600;} } .premium {padding-top:30px; overflow:hidden;max-width:1400px; width:100%; text-align:center; margin:0 auto;} .premium .titleWrap {padding:100px 0px 50px 0px; text-align:center;} .premium .titleWrap p {font-size:22px; color:#595858; font-weight:600;} .premium .titleWrap p.tit {font-size:37px; color:#595959; font-weight:500;} .premium .divide42 {background:#eeeeee; overflow:hidden;max-width:1400px; width:100%; padding:50px 0px; margin:0 auto; } .premium .divide42 li {width:25%; float:left; text-align:center; box-sizing:border-box;} .premium .divide42 li + li {border-left:0px solid #fff;} .premium .divide42 li p {font-size:20px; font-weight:500; color:#000; line-height:30px; padding-top:10px;} .premium .txtWrap {text-align:center; padding:100px 0px 0px;} .premium .txtWrap h1 {font-size:25px; line-height:50px; color:#004655; font-weight:600;} .premium .txtWrap h2 {font-size:20px; color:#8fc43d; font-weight:500;} @media screen and (max-width:1200px){ .premium .divide42 li p {font-size:15px; color:#3b3b3b; line-height:24px; padding-top:10px;} } @media screen and (max-width:900px){ .premium .titleWrap {padding:0px 0px 50px 0px; text-align:center;} .premium .titleWrap p {font-size:19px; color:#595858; font-weight:600;} .premium .titleWrap p.tit {font-size:27px; color:#595959; font-weight:500;} } @media screen and (max-width:479px){ .premium {padding:0px 0px;} .premium .titleWrap {padding-top:50px;} .premium .titleWrap p {font-size:14px; color:#595858; font-weight:600;} .premium .titleWrap p.tit {font-size:19px; color:#595959; font-weight:500;} .premium .divide42 {padding:0px 0px;} .premium .divide42 li {width:50%; height:220px; float:left; text-align:center; padding:20px 10px 10px; box-sizing:border-box;} .premium .divide42 li + li {border-left:0px solid #fff; border-top:0px solid #fff;} .premium .divide42 li p {font-size:12px; font-weight:500; color:#000; line-height:20px; padding-top:10px;} .premium .divide42 li:nth-child(2) {border-top:0px solid #fff;} .premium .divide42 li:nth-child(3) {border-left:0px solid #fff;} } @media screen and (min-width:901px){ .view901 {display:block} .view900 {display:none} } @media screen and (max-width:900px){ .view901 {display:none} .view900 {display:block} } .premiug_service {overflow:hidden;max-width:1400px; width:100%; text-align:center; margin:0 auto; padding:100px 0px 0px;} .premiug_service p {font-size:17px; color:#595858; font-weight:400; line-height:50px;} .premiug_service p img {padding-bottom:30px;} .premiug_service p span {padding-right:50px;} .premiug_service p.tit {font-size:27px; color:#1b54a4; font-weight:600; line-height:50px;} .premiug_service p.sml {font-size:18px; color:#000; font-weight:500; line-height:50px;} .premiug_service .divide4 {overflow:hidden;max-width:1400px; width:100%; padding:50px 150px; margin:0 auto;} .premiug_service .divide4 li {width:25%; float:left; text-align:center; box-sizing:border-box;} .premiug_service .divide4 li + li {border-left:1px solid #c4c4c4;} .premiug_service .divide4 li p {font-size:18px; color:#3f3a39; line-height:30px; padding-top:10px;} .premiug_service .divide5 {overflow:hidden;max-width:1400px; width:100%; padding:50px 250px; margin:0 auto;} .premiug_service .divide5 li {width:33.3333%; float:left; text-align:center; box-sizing:border-box;} .premiug_service .divide5 li + li {border-left:0px solid #c4c4c4;} .premiug_service .divide5 li h2 {font-size:25px; color:#1b54a4; line-height:35px; font-weight:600; padding-top:10px;} .premiug_service .divide5 li p {font-size:20px; color:#000; line-height:30px; } .premiug_service .premiug_img {} .premiug_service .premiug_img p.sm {text-align:right; font-size: 12px; font-weight: 400; color: #717176; line-height:16px;letter-spacing: -0.04em} .premiug_service2 {overflow:hidden;max-width:1400px; width:100%; text-align:center; margin:0 auto; padding:50px 0px 100px 0px;} .premiug_service2 p {font-size:17px; color:#595858; font-weight:400; line-height:24px;padding-top:10px;} .premiug_service2 p span {padding-right:50px;} .premiug_service2 li {width:32.33333%; float:left; text-align:center; box-sizing:border-box; margin:20px 0px;} .premiug_service2 li p {font-size:18px; color:#3f3a39; line-height:30px; padding-top:10px;} @media screen and (max-width:900px){ .premiug_service .divide5 {padding:50px 50px; margin:0 auto;} .premiug_service p.tit {font-size:24px; line-height:50px;} .premiug_service .divide5 li h2 {font-size:20px; line-height:30px;padding-top:10px;} .premiug_service .divide5 li p {font-size:17px; line-height:24px; } } @media screen and (max-width:479px){ .premiug_service {padding:50px 0px 0px;} .premiug_service p.tit {font-size:17px; line-height:24px;} .premiug_service p.sml {font-size:12px; line-height:20px;} .premiug_service .divide5 {padding:30px 20px; margin:0 auto;} .premiug_service .divide5 li {padding:0 10px;} .premiug_service .divide5 li h2 {font-size:14px; line-height:18px;padding-top:10px;} .premiug_service .divide5 li p {font-size:13px; line-height:16px; } } @media screen and (max-width:400px){ } /***** 커뮤니티 *****/ .communityWrap {overflow:hidden;max-width:1400px; width:100%; text-align:center; margin:0 auto; padding:100px 0px; } .communityWrap p {font-size:19px; color:#000; font-weight:500; padding:5px 0px; text-align:center;} .communityWrap p.brown {font-size:25px; color:#000; font-weight:700;} .communityWrap p span {font-size:16px; padding:0 20px;} .communityWrap .list {width:100%;} .communityWrap .list ul:first-child {padding-top:150px;} .communityWrap .list ul {padding-bottom:80px;} .communityWrap .list li {float:left; padding-bottom:80px;} .communityWrap .list li.left {width:35%; padding-right:20px; padding-top:25px;} .communityWrap .list li.left p {font-size:18px; color:#5c5a59; text-align:left; line-height:33px;} .communityWrap .list li.left p.tit {font-size:35px; color:#232323; line-height:40px; font-weight:600;} .communityWrap .list li.right {width:65%;} .communityWrap .list li.right p.sm {text-align:right; padding-top:10px;font-size: 12px; font-weight: 400; color: #717176; letter-spacing: -0.04em} @media screen and (max-width:1200px){ .communityWrap {padding:100px 25px; } } @media screen and (max-width:900px){ .communityWrap {padding:100px 0px; 0px} .communityWrap p {font-size:17px;} .communityWrap p.brown {font-size:20px;} .communityWrap .list ul:first-child {padding-top:60px;} .communityWrap .list ul {padding-bottom:20px;} .communityWrap .list li.left {padding-top:10px;} .communityWrap .list li.left p {font-size:16px; line-height:22px;} .communityWrap .list li.left p br {display:none;} .communityWrap .list li.left p.tit {font-size:24px; line-height:35px;} } @media screen and (max-width:768px){ .communityWrap {padding:40px 0px 0px; } .communityWrap p.brown {font-size:17px;} .communityWrap p {font-size:13px; } .communityWrap p span {font-size:12px; padding:0 10px;} .communityWrap .list li {float:none; padding-bottom:10px;} .communityWrap .list ul:first-child {padding-top:30px;} .communityWrap .list li.left {width:100%; padding-right:0px; padding-top:0px;} .communityWrap .list li.left p {font-size:14px; line-height:20px;} .communityWrap .list li.left p.tit {font-size:18px; line-height:24px;} .communityWrap .list li.right {width:100%;} } /***** 시스템 *****/ .systemWrap {overflow:hidden;max-width:1400px; width:100%; text-align:center; margin:0 auto; padding:100px 0px; } .systemWrap .list {width:100%; padding-bottom:100px;} .systemWrap .list p {font-size:26px; color:#b07b66; text-align:left; line-height:50px; font-weight:600;} .systemWrap .list p span {padding:0px 15px;} .systemWrap .list img {padding-top:30px;} .systemWrap .list li {position: relative; font-size:18px; color:#5c5a59; line-height:33px; text-align:left; padding-left:15px;} .systemWrap .list li:before {content: '-'; position: absolute; top:0px; left: 0; padding-left:0px;} .systemWrap .list p.sm {text-align:right; padding-top:10px;font-size: 12px; font-weight: 400; color: #717176; letter-spacing: -0.04em} @media screen and (max-width:1400px){ .systemWrap {padding:0px 25px; } } @media screen and (max-width:900px){ .systemWrap .list {width:100%; padding-bottom:50px;} .systemWrap .list p {font-size:20px; color:#b07b66; text-align:left; line-height:40px; font-weight:600;} .systemWrap .list li {position: relative; font-size:17px; color:#5c5a59; line-height:26px; text-align:left; padding-left:15px;} .systemWrap .list img {padding-top:10px;} } @media screen and (max-width:479px){ .systemWrap .list p {font-size:19px; } .systemWrap .list li {position: relative; font-size:15px; padding-left:12px;} } /***** 동호수배치도 *****/ .layout1 {position: relative; overflow:hidden; max-width:1400px; width:100%; padding-top:50px; text-align:center; margin:0 auto;} .layout1 .LogoWrap {overflow:hidden; background:#27265a; position: relative; } .layout1 .LogoWrap .logo {position:absolute; top:90px; left:80px;} .layout1 .LogoWrap .textwrap {padding:50px 0px 50px 40%;} .layout1 .LogoWrap .textwrap p {position: relative; text-align:left; color:#fff; font-size:18px; line-height:40px; padding-left:25px; padding-bottom:10px;} .layout1 .LogoWrap .textwrap p:before {position:absolute; content:'-'; font-size:18px; color:#fff; top:0px; left:10px;} h1.layoutTit {font-size:28px; color:#000; text-align:center; font-weight:600; padding:80px 0px 30px;} .layout1 p.sm {text-align:left; padding-top:10px;font-size: 12px; font-weight: 400; color: #717176; letter-spacing: -0.04em} .layout1 p.img {padding:100px 0px;} @media screen and (max-width:1200px){ .layout1 {padding:0px 25px; } } @media(max-width:768px){ .layout1 .LogoWrap .logo {position:relative; top:50px; left:0%;} .layout1 .LogoWrap .textwrap {padding:80px 20px 30px 20px;} .layout1 .LogoWrap .textwrap p {position: relative; text-align:left; color:#fff; font-size:15px; line-height:28px; padding-bottom:10px;} .layout1 .LogoWrap .textwrap p:before {position:absolute; content:'-'; font-size:13px; color:#fff; top:0px;} } @media(max-width:479px){ .layout1 .LogoWrap .textwrap p {font-size:14px; line-height:22px;} .layout1 p.sm {text-align:left; padding-top:10px;font-size: 10px;} .layout1 {padding:0px 15px; } } /*********** 세대안내 : 타입별 평면도 **********/ .con {max-width:1200px; width:100%; margin:0 auto;} .type {padding-bottom:100px;} .type h2 {padding-top:50px; font-size:26px; color:#010101; text-align:center; font-weight:500;} .type p.sm {text-align:left; padding-top:10px;font-size: 12px; font-weight: 400; color: #717176; letter-spacing: -0.04em} @media screen and (max-width:1200px){ .type {padding:0px 25px; } } @media(max-width:479px){ .type h2 {padding-top:20px; padding-bottom:20px; font-size:16px;} } .type_line {width:100%; height:1px; background:#737373;} /** tab style **/ .tab_style{display:flex; justify-content: center; column-gap: 10px; text-align:left; margin:50px 0 40px;} .tab_style li,.tab_style li a{box-sizing:border-box;} .tab_style li{width:calc(18.285% - 2px);margin:0 1px} .tab_style li a{display:block;height:100%; background:#413222; padding:20px 0;line-height:45px;color:#fff;font-size:32px;text-align:center;} @media(max-width:900px){ .tab_style li a{padding:10px 0;line-height:28px;color:#fff;font-size:28px;} } .tab_style li.on a{color:#fff;background:#ff5fa4;border:none;} /***타입표 ***/ .tableWrap {overflow:hidden; width:100%; max-width:1400px; padding-bottom:0px; text-align:center; box-sizing: border-box;} .tableWrap li {float:left; width:20%; border-right:1px solid #8e8e8e; border-bottom:1px solid #8e8e8e; padding:0px 20px 20px 50px; text-align:left; font-size:30px; color:#000000; box-sizing: border-box;} .tableWrap li:last-child {border-right:none;} .tableWrap li span{font-size:16px; color:#6d6d6d;} @media(max-width:1200px){ .tableWrap {padding-top:50px; padding-bottom:50px;} .tableWrap li{float:left; width:20%; font-size:24px;} .tableWrap li span{font-size:14px;} } @media(max-width:768px){ .tableWrap li{float:left; width:20%; font-size:20px; padding:0px 10px 10px 25px; } .tableWrap li span{font-size:14px;} } @media(max-width:479px){ .type {padding:0px 25px 50px;} .tab_style{display:flex; justify-content: center; column-gap:5px; text-align:left; margin:20px 0 20px;} .tab_style li a{padding:10px 0;line-height:22px;color:#fff;font-size:18px;} .tableWrap {padding-top:30px; padding-bottom:20px;} .tableWrap li{font-size:14px;padding:0px 5px 10px 5px; } .tableWrap li span{font-size:11px;} .type p.sm {text-align:left; padding-top:10px;font-size: 10px; font-weight: 400; color: #717176; letter-spacing: -0.04em} } @media(max-width:400px){ .type {padding:0px 25px 50px;} .tab_style{display:flex; justify-content: center; column-gap:5px; text-align:left; margin:20px 0 20px;} .tab_style li a{padding:10px 0;line-height:22px;color:#fff;font-size:18px;} .tableWrap {padding-top:30px; padding-bottom:20px;} .tableWrap li{font-size:11px;padding:0px 3px 5px 3px; } .tableWrap li span{font-size:9px;} .type p.sm {text-align:left; padding-top:10px;font-size: 10px; font-weight: 400; color: #717176; letter-spacing: -0.04em} } .sub-content-box {position:relative; padding-top:70px;padding-bottom:0px;} .sub-content-box p {text-align:center;} .sub-content-box p.typeImg {padding:60px 0px 0px;} p.tb_right {position:absolute; top:170px; right:0; color:#141414; font-weight:500; font-size:22px;} p.tb_right span {padding:0 20px;} .type_tit {font-family:'Noto Sans KR',sans-serif; font-size:40px; color:#413222;} .type_tit strong {font-size:120px; font-weight:600; line-height:140px;} .type_tit span {font-size:80px; font-weight:600; line-height:140px;} @media(max-width:1200px){ p.tb_right {top:120px; font-size:20px;} .type_tit strong {font-size:60px; font-weight:600; line-height:100px;} .type_tit span {font-size:40px; font-weight:600; line-height:100px;} } @media(max-width:900px){ .sub-content-box {padding-top:0px;padding-bottom:0px;} .st_text span {font-weight:lighter;} .type_tit {font-size:20px; color:#27265a;} .type_tit strong {font-size:50px; font-weight:600; line-height:65px;} .type_tit span {font-size:40px; font-weight:600; line-height:65px;} p.tb_right {position:absolute; top:35px; right:0; color:#141414; font-weight:500; font-size:16px;} p.tb_right span {padding:0 10px;} } @media(min-width:768px){ .forM {display:none;} } @media(max-width:479px){ .type_tit strong {font-size:30px; font-weight:600; line-height:45px;} .type_tit span {font-size:25px; font-weight:600; line-height:45px;} p.tb_right {position:absolute; top:20px; right:0; color:#141414; font-weight:500; font-size:14px;} .sub-content-box p.typeImg {padding:0px 0px 0px;} } /*********** 분양안내 : 모집공고 **********/ .sub4Wrap {position: relative; overflow:hidden; max-width:1200px; width:100%; padding-top:50px; padding-bottom:100px; text-align:center; margin:0 auto;} .sub4Wrap .contents_area {width:100%; background:#dadada; padding:50px 150px; overflow:hidden;box-sizing:border-box;} .sub4Wrap .contents_area .L {float:left; width:50%; text-align:left;} .sub4Wrap .contents_area .L h2 {font-size:22px; color:#3b3b3b;} .sub4Wrap .contents_area .L .icon_area {background:#f7f7f7; width:100%; max-width:400px; padding:20px 50px; margin-top:30px; margin-bottom:30px;} .sub4Wrap .contents_area .L .icon_area li {font-size:14px; color:#3b3b3b; line-height:20px;} .sub4Wrap .contents_area .L .icon_area li.icon1 {background:url("/design/default/images/sub/info3_icon1.jpg") no-repeat ; border-bottom:1px solid #cfcfcf; padding:10px 10px 20px 80px;} .sub4Wrap .contents_area .L .icon_area li.icon2 {background:url("/design/default/images/sub/info3_icon2.jpg") no-repeat left 10px; padding:20px 10px 10px 80px;} .sub4Wrap .contents_area .R {float:left; width:50%; text-align:center; padding:65px 0px 0px 50px; box-sizing:border-box;} .sub4Wrap1400 {position: relative; overflow:hidden; max-width:1400px; width:100%; padding-top:50px; text-align:center; margin:0 auto;} @media all and (max-width: 1200px) { .sub4Wrap {padding:50px 25px 100px;} } @media all and (max-width: 768px) { .sub4Wrap .contents_area {width:100%; padding:30px 30px; overflow:hidden;} .sub4Wrap .contents_area .L {float:none; width:100%;} .sub4Wrap .contents_area .L h2 {font-size:20px; color:#3b3b3b;} .sub4Wrap .contents_area .L .icon_area {background:#f7f7f7; width:100%; max-width:400px; padding:10px 20px; margin-top:20px; margin-bottom:10px;} .sub4Wrap .contents_area .L .icon_area li {font-size:14px; color:#3b3b3b; line-height:20px;} .sub4Wrap p {font-size:17px;} .sub4Wrap .contents_area .R {float:none; width:100%; text-align:center; padding:30px 0px 0px 0px;box-sizing:border-box;} } @media all and (max-width: 479px) { .sub4Wrap {padding:30px 15px 50px;} .sub4Wrap .contents_area {padding:20px 15px 10px 15px;} .sub4Wrap .contents_area .L .icon_area {padding:20px; margin-top:15px; margin-bottom:15px;} .sub4Wrap .contents_area .L .icon_area li {font-size:13px; color:#3b3b3b; line-height:18px;} .sub4Wrap .contents_area .L .icon_area li br {display:none;} .sub4Wrap .contents_area p {font-size:14px;} } /** 버튼**/ .mainBtn-area {position:relative; margin-bottom:10px;} .mainBtn-area a.mainBtn {color:#fff; font-size:26px; font-weight:500; line-height:40px; width:425px; text-align:center; display:block; padding:30px 0px;vertical-align: middle;} .mainBtn-area a.mainBtn img {vertical-align: middle; padding:0 10px;} .mainBtn-area a.btn-red{text-align:center;background:#aea8a5;color:#fff;} .mainBtn-area a.btn-red:hover{background:#92a18a;} .mainBtn-area a.btn-red.btn-effect{background:#272724 !important;} .mainBtn-area a.btn-red.btn-effect:hover::before{background:#92a18a;} @media all and (max-width: 768px) { .mainBtn-area {margin-top:10px; } .mainBtn-area a.mainBtn {margin:0 auto; max-width:325px; width:100%; font-size:20px;} } /** 버튼2**/ .mainBtn-area2 {position:relative; margin-bottom:10px;} .mainBtn-area2 a.mainBtn {color:#fff; font-size:18px; font-weight:500; width:425px; text-align:center; display:block; padding:20px 0px;vertical-align: middle;} .mainBtn-area2 a.mainBtn img {vertical-align: middle; padding:0 10px;} .mainBtn-area2 a.btn-green{text-align:center;background:#003a30;color:#fff;} .mainBtn-area2 a.btn-green:hover{background:#000;} .mainBtn-area2 a.btn-green.btn-effect{background:#92a18a !important;} .mainBtn-area2 a.btn-green.btn-effect:hover::before{background:#272724;} @media all and (max-width: 768px) { .mainBtn-area2 {margin-top:0px; } .mainBtn-area2 a.mainBtn {margin:0 auto; max-width:325px; width:100%; font-size:14px;} .mainBtn-area2 a.mainBtn img {vertical-align: middle; padding:0 5px;} } /** 버튼3**/ .mainBtn-area3 {overflow:hidden; background:#d1b799; position:relative; padding:30px 0px; margin-bottom:10px;} .mainBtn-area3 a.mainBtn {color:#27265a; font-size:40px; font-weight:700; width:100%; text-align:center; display:block; padding:30px 0px 10px 0px;vertical-align: middle;} .mainBtn-area3 a.mainBtn:hover {color:#fff; transition: all .5s;} .mainBtn-area3 a.mainBtn img {vertical-align: middle; padding:0 10px;} .mainBtn-area3 p {color:#fff; font-size:19px; font-weight:400; width:100%; text-align:center; display:block; padding:20px 0px;vertical-align: middle;} .mainBtn-area3 a.btn-green{text-align:center;background:#d1b799;color:#27265a;} .mainBtn-area3 a.btn-green.btn-effect:hover::before{color:#fff;} @media all and (max-width: 768px) { .mainBtn-area3 {padding:10px 0px; margin-top:0px; } .mainBtn-area3 a.mainBtn {margin:0 auto; max-width:325px; width:100%; font-size:22px;} .mainBtn-area3 a.mainBtn img {vertical-align: middle; padding:0 5px;} .mainBtn-area3 p {font-size:14px; padding:0px 20px;} } .btn-effect{position:relative;background:transparent !important} .btn-effect.hasicon::after, .btn-effect span{position:relative;z-index:1} .btn-effect::before{position:absolute;top:0;left:0;width:100%;height:0;z-index:0;transition:height .3s ease-in-out;content:''} .btn-effect:hover::before{height:100%} .w1200 {width:100%; max-width:1200px; margin:0 auto;} .w1400 {width:100%; max-width:1400px; margin:0 auto;} @media all and (max-width: 1400px) { .w1200 {padding:0px 25px;} .w1400 {padding:0px 25px;} } @media all and (max-width: 479px) { .w1200 {padding:0px 15px 50px 15px; } } /*** 민간입대주택 ***/ .housewrap {max-width:1400px; width:100%; margin:0 auto; padding-top:50px;} .house1 {position:relative; background:#eeeeee; text-align:center; padding:100px 50px;} .house1 .house_title {position:absolute; top:-25px; left:50%; margin-left:-175px; width:350px; height:55px; border-radius:55px; background:#ff5fa4; font-size:28px; font-weight:600; color:#fff; line-height:55px; text-align:center;} .house1 .house_txt {padding:0px 0px 50px;} .house1 .house_txt p {font-size:20px; color:#3f3a39; line-height:40px;} .house1 .house_txt p span {color:#d44846;} .house1 .bar {margin:0 auto; width:100%; max-width:700px; border-top:1px dotted #c6c7c7;} .housewrap .icon_plus {padding:30px 0px 55px; text-align:center;} .housewrap .icon_arrow {padding:30px 0px; text-align:center;} .house2 {position:relative; background:#1b54a4; text-align:center; padding:50px;} .house2 p {font-size:19px; color:#fff; line-height:40px;} .house2 p span {font-size:23px; color:#f2a3c5;} @media all and (max-width: 900px) { .house2 {padding:30px} .house2 p {font-size:17px; line-height:30px;} .house2 p span {font-size:20px;} } @media all and (max-width: 768px) { .house1 .house_txt p {font-size:17px; line-height:30px;} .house2 p {font-size:17px;line-height:30px;} .house2 p span {font-size:19px;} } @media all and (max-width: 479px) { .house1 {padding:50px 20px;} .house1 .house_title {top:-25px; left:50%; margin-left:-125px; width:250px; height:45px; border-radius:45px; font-size:20px; line-height:45px;} .house1 .house_txt p {font-size:14px; line-height:22px;} .house2 p {font-size:14px;line-height:22px;} .house2 p span {font-size:16px;} } .housewrap .h_dividewrap {padding:180px 0px 80px; display: flex; flex-direction:row; justify-content:flex-start; justify-content: space-evenly; align-items:flex-start; flex-wrap:nowrap; } .housewrap .h_dividewrap .left {flex:50%; padding-left:180px;} .housewrap .h_dividewrap .right {flex:50%;} .housewrap .h_dividewrap .divide h2 {vertical-align:top; font-size:21px; color:#1b54a4; line-height:40px; font-weight:500;} .housewrap .h_dividewrap .divide h2 strong {font-size:28px; font-weight:700;} .housewrap .h_dividewrap .divide p {position:relative;font-size:19px; line-height:40px; color:#000;} .housewrap .h_dividewrap .divide p:before {position: absolute; content: '+'; top: 1px; left: -20px; font-size: 17px;} @media all and (max-width: 900px) { .housewrap .h_dividewrap {padding:80px 20px 40px; display: flex; flex-direction:row; justify-content:flex-start; justify-content: space-evenly; align-items:flex-start; flex-wrap:nowrap; } .housewrap .h_dividewrap .left {flex:50%; padding-left:0px;} .housewrap .h_dividewrap .divide h2 {font-size:18px;line-height:28px;} .housewrap .h_dividewrap .divide h2 strong {font-size:24px;} .housewrap .h_dividewrap .divide p {font-size:16px; line-height:24px; padding-bottom:10px;} .housewrap .h_dividewrap .divide p:before {top: 1px; left: -14px; font-size: 14px;} } @media all and (max-width: 768px) { .housewrap .h_dividewrap {padding:40px 20px 40px; display: flex; flex-direction:column; justify-content:flex-start; justify-content: space-evenly; align-items:flex-start; flex-wrap:nowrap; } .housewrap .h_dividewrap .left {flex:1; padding-left:0px;} .housewrap .h_dividewrap .divide h2 br {display:none;} .housewrap .h_dividewrap .right {flex:1; padding-top:20px; padding-left:20px;} } @media all and (max-width: 479px) { .housewrap .h_dividewrap .divide h2 {font-size:16px;line-height:22px;} .housewrap .h_dividewrap .divide h2 strong {font-size:18px;} .housewrap .h_dividewrap .divide p {font-size:14px; line-height:24px; padding-bottom:5px;} .housewrap .h_dividewrap .divide p:before {top: 1px; left: -14px; font-size: 13px;} } .house3 {position:relative; background:#eeeeee; text-align:center; padding:50px;} .house3 .dividewrap {display: flex; flex-direction:row; justify-content:flex-start; justify-content: space-evenly; align-items:center; flex-wrap:nowrap;} .house3 .dividewrap .divide1 {flex:30%; text-ailgn:right; padding-right:30px; border-right:1px solid #a9a9a9;} .house3 .dividewrap .divide2 {flex:70%;} .house3 .dividewrap .divide2 img {padding:0px 5px;} @media all and (max-width: 900px) { .house3 {position:relative; background:#eeeeee; text-align:center; padding:20px;} .house3 .dividewrap {display: flex; flex-direction:column; justify-content:flex-start; justify-content: space-evenly; align-items:center; flex-wrap:nowrap;} .house3 .dividewrap .divide1 {flex:1; text-ailgn:center; padding-right:0px; border-right:0px solid #a9a9a9;} .house3 .dividewrap .divide2 {flex:1; padding-top:30px;} .house3 .dividewrap .divide2 img {padding:0px 5px;} } @media all and (max-width: 479px) { .house3 .dividewrap .divide2 img {padding:10px 5px;} } .tableWrap_blue {width:100%; max-width:1400px; margin:0 auto;} .tableWrap_blue p {font-size:21px; font-weight:600; color:#1b54a4; text-align:left; padding:30px 0px 20px;} .blue-tbl{width:100%; text-align:center; box-sizing:border-box;border:1px solid #e2e4e5;} .blue-tbl th, .blue-tbl td{font-family:'Noto Sans KR',sans-serif; font-size:16px; line-height:1.2em; padding:25px 0px; text-align:center; border-bottom:1px solid #e2e4e5;} .blue-tbl th{background:#1b54a4; color:#fff; text-align:center;} .blue-tbl th.blue {background:#c9ddf2; color:#000;} .blue-tbl td.darkblue {background:#1b54a4; color:#fff;} .blue-tbl th.gray {background:#f0f1f1; color:#000;} .blue-tbl td.skyblue {background:#f5f8fd; color:#3f3a39; font-weight:500;} .bluetext {margin-top:130px; background:#1b54a4; width:100%; padding:100px 0px; text-align:center;} .bluetext .w1400 {width:100%; max-width:1400px; margin:0 auto;} .bluetext h2 {padding-bottom:100px;font-size:38px; color:#ed81b1; text-align:left;} .bluetext img {} @media all and (max-width: 900px) { .tableWrap_blue {padding:0 25px;} .blue-tbl th, .blue-tbl td{font-size:14px;} .bluetext {margin-top:60px; padding:50px 0px;} .bluetext h2 {padding-bottom:50px;font-size:20px;} } @media all and (max-width: 768px) { .tableWrap_blue p {font-size:18px; padding:20px 0px 10px;} } @media all and (max-width: 479px) { .tableWrap_blue {padding:0 15px;} .tableWrap_blue p {font-size:16px; padding:20px 0px 10px;} .blue-tbl th, .blue-tbl td{font-size:12px;} .bluetext {margin-top:40px; padding:30px 0px;} .bluetext h2 {padding-bottom:30px;font-size:16px;} } /*** 오시는 길***/ .locationwrap {width:100%; max-width:1400px; margin:0 auto;} .locationwrap .boxwrap {background:#dcdcdc; display: flex; flex-direction:row; justify-content:flex-start; justify-content: space-evenly; align-items:center; flex-wrap:nowrap;} .locationwrap .boxwrap .box1 {flex:65%; text-ailgn:center; } .locationwrap .boxwrap .box2 {flex:35%; text-ailgn:center; background:#dcdcdc;} .locationwrap .boxwrap .box2 h2 {font-size:28px; line-height:50px; color:#272724; font-weight:700;text-align:center;} .locationwrap .boxwrap .box2 p {font-size:20px; color:#323232; font-weight:500;text-align:center;} .locationwrap .boxwrap .box2 .buttonwrap {position:relative; text-align:center; margin:40px 0px;} .locationwrap .boxwrap .box2 .buttonwrap a {margin:0 auto; width:320px; background:#111708; text-align:center; font-size:28px; padding:20px 30px; border-radius:20px; color:#b5936d; font-weight:600;} .locationwrap .boxwrap .box2 .buttonwrap a:hover {background:#b5936d; color:#111708;transition: background-color .25s} .locationwrap .boxwrap .box2 h3 {font-size:40px; font-weight:600; color:#000;text-align:center;} .locationwrap .boxwrap .box2 .logo {text-align:center; padding-top:50px;} .locationwrap:nth-child(2) {padding-top:70px;} @media all and (max-width: 900px) { .locationwrap .boxwrap {display: flex; flex-direction:column; justify-content:flex-start; justify-content: space-evenly; align-items:center; flex-wrap:nowrap;} .locationwrap .boxwrap .box2 {padding:20px 0px;} .locationwrap .boxwrap .box2 .logo {text-align:center; padding-top:20px;} } @media all and (max-width: 479px) { .locationwrap .boxwrap .box2 h2 {font-size:20px; line-height:30px;} .locationwrap .boxwrap .box2 p {font-size:18px;} .locationwrap .boxwrap .box2 .buttonwrap {margin:20px 0px; padding:20px 0px;} .locationwrap .boxwrap .box2 .buttonwrap a {width:220px; font-size:20px; padding:20px 30px; border-radius:10px;} .locationwrap .boxwrap .box2 h3 {font-size:20px;} .locationwrap .boxwrap .box2 h3 img {width:30px; padding-right:5px;} } /*** 단지정보 ***/ .mapwrap {width:100%; background:#eeeeee; padding:100px 0px;} .mapwrap .mapcontents {width:100%; max-width:1400px; margin:0 auto; display: flex; flex-direction:row; justify-content:flex-start; justify-content: space-evenly; align-items:flex-start; flex-wrap:nowrap;} .mapwrap .mapcontents .box1 {flex:45%; text-ailgn:center;} .mapwrap .mapcontents .box2 {flex:55%; text-ailgn:center; padding:50px 0px 0px 50px;} .mapwrap .mapcontents .box2 h3 {font-size:26px; color:#000; font-weight:500;} .mapwrap .mapcontents .box2 h2 {font-size:35px; line-height:55px; color:#000; font-weight:500;} .mapwrap .mapcontents .box2 h2 span {font-weight:700;} .mapwrap .mapcontents .box2 .maptextwrap {padding-top:50px;} .mapwrap .mapcontents .box2 .maptextwrap h4 {font-size:23px; line-height:45px; font-weight:600; color:#000;} .mapwrap .mapcontents .box2 .maptextwrap p {font-size:17px; line-height:30px; padding-bottom:10px; font-weight:400; color:#000;} .mapimgwrap {width:100%; max-width:1400px; margin: 0 auto; padding-top:40px;} @media all and (max-width: 900px) { .mapwrap .mapcontents {display: flex; flex-direction:column; justify-content:flex-start; justify-content: space-evenly; align-items:center; flex-wrap:nowrap;} .mapwrap .mapcontents .box1 {flex:1; text-ailgn:center;} .mapwrap .mapcontents .box2 {flex:1; text-ailgn:center; padding:50px 0px 0px 50px;} } @media all and (max-width: 768px) { .mapwrap {padding:50px 0px;} .mapwrap .mapcontents .box2 h3 {font-size:20px;} .mapwrap .mapcontents .box2 h2 {font-size:24px; line-height:35px;} .mapwrap .mapcontents .box2 .maptextwrap {padding-top:30px;} .mapwrap .mapcontents .box2 .maptextwrap h4 {font-size:19px; line-height:35px;} .mapwrap .mapcontents .box2 .maptextwrap p {font-size:15px; line-height:20px;} } @media all and (max-width: 479px) { .mapwrap .mapcontents .box1 {padding:0px 30px;} .mapwrap .mapcontents .box2 {flex:1; text-ailgn:center; padding:50px 20px 0px 20px;} .mapwrap .mapcontents .box2 h3 {font-size:18px;} .mapwrap .mapcontents .box2 h2 {font-size:22px; line-height:35px;} .mapwrap .mapcontents .box2 .maptextwrap {padding-top:20px;} .mapwrap .mapcontents .box2 .maptextwrap h4 {font-size:17px; line-height:30px;} .mapwrap .mapcontents .box2 .maptextwrap p {font-size:14px; line-height:20px;} } .pinkbluewrap {padding-top:100px;} .pinkblue {padding-bottom:25px; text-align:center;} .pinkblue:first-child(1) {padding-top:100px;} .bluewrap {background:#1b54a4; width:100%; max-width:1400px; height:137px; margin:0 auto; display: flex; flex-direction:row; justify-content:flex-start; justify-content: space-evenly; align-items:center; flex-wrap:nowrap;} .bluewrap .box1 {flex:10%;} .bluewrap .box1 .white {background:#fff; text-align:center; margin:7px;} .bluewrap .box2 {flex:90%; padding-left:90px; text-align:left; font-size:27px; color:#f2a3c5; font-weight:600;} .pinkwrap {background:#f2a3c5; max-width:1400px; height:137px; margin:0 auto; display: flex; flex-direction:row; justify-content:flex-start; justify-content: space-evenly; align-items:center; flex-wrap:nowrap;} .pinkwrap .box1 {flex:10%;} .pinkwrap .box1 .white {background:#fff; text-align:center; margin:7px;} .pinkwrap .box2 {flex:90%; padding-left:90px; text-align:left; font-size:27px; color:#1b54a4; font-weight:600;} @media all and (max-width: 900px) { .bluewrap .box1 {flex:30%;} .bluewrap .box1 .white {background:#fff; text-align:center; margin:7px;} .bluewrap .box2 {flex:70%; padding:0px 20px; font-size:20px;} .pinkwrap .box1 {flex:30%;} .pinkwrap .box1 .white {background:#fff; text-align:center; margin:7px;} .pinkwrap .box2 {flex:70%; padding:0px 20px; font-size:20px;} } @media all and (max-width: 479px) { .bluewrap {height:auto;} .bluewrap .box1 {flex:30%;} .bluewrap .box1 .white {background:#fff; text-align:center; margin:5px;} .bluewrap .box2 {flex:70%; padding:0px 20px; font-size:15px;} .pinkblue {padding-bottom:15px;} .pinkwrap {height:auto;} .pinkwrap .box1 {flex:30%;} .pinkwrap .box1 .white {background:#fff; text-align:center; margin:5px;} .pinkwrap .box2 {flex:70%; padding:0px 20px; font-size:15px;} } /*** 시스템 ***/ .system_divide {overflow:hidden; max-width:1400px; width:100%; margin:0 auto; padding-bottom:50px;} .system_divide .Big {float:left; overflow:hidden; width:45%; height:800px; margin-bottom:15px; box-sizing:border-box;} .system_divide .Small {position: relative; overflow:hidden; float:left; width:54%; height:800px; margin-bottom:15px; box-sizing:border-box;} .system_divide .mL1{margin-left:1%;} .system_divide .Small .down {position: absolute; left:0; bottom:0; } .system_divide .Small .up {text-align:left; padding:20px 0px;} .system_divide .Small .up p {font-size:20px; line-height:35px; color:#000; font-weight:500; padding:16px 0px 20px;} .system_divide .Small .up p strong {font-size:27px; font-weight:600; } .system_divide .Small .up p.tit {font-size:24px; line-height:35px; color:#f390bb; font-weight:600;} .system_divide .Small .up h1 {font-family:'Noto Sans KR',sans-serif; font-size:40px; line-height:60px; color:#ed76aa; font-weight:600;} .system_divide .Small .up .txtwrap {padding-top:30px;} .system_divide .Small .up .txtwrap h2 {font-size:23px; line-height:35px; color:#000; font-weight:600;} .system_divide .Small .up .txtwrap li {position: relative; font-size:17px; padding-left:10px; color:#000; line-height:40px;} /*.system_divide .Small .up .txtwrap li::before{position:absolute;top:1px;left:0;content:'·'}*/ .system_divide .Small .up .right {text-align:right;} @media screen and (max-width:1200px){ .system_divide {padding:0px 25px 50px 25px;} } @media screen and (max-width:900px){ .system_divide {padding:0 0px;} .system_divide .Big {height:500px;} .system_divide .Small {height:500px;} .system_divide .Small .up p {font-size:18px; line-height:25px; color:#000; font-weight:500; padding:16px 0px 20px;} .system_divide .Small .up p strong {font-size:22px; font-weight:600; } .system_divide .Small .up p.tit {font-size:20px; line-height:25px; color:#f390bb; font-weight:600;} .system_divide .Small .up h1 {font-size:30px; line-height:50px;} .system_divide .Small .up .txtwrap {padding-top:15px;} .system_divide .Small .up .txtwrap h2 {font-size:18px; line-height:24px;} .system_divide .Small .up .txtwrap li {position: relative; font-size:14px; padding-left:0px; color:#000; line-height:24px;} } @media screen and (max-width:479px){ .system_divide .Big {display:none;} .system_divide .Small {float:none; width:100%; height:auto; margin-bottom:15px;} .system_divide .Small .down {position: relative;} .system_divide .mL1{margin-left:0%;} .system_divide .Small .down {float:none; width:100%;} .system_divide .Small .up {float:none; width:100%; padding:20px 0px;} .system_divide .Small .up p {font-size:15px; line-height:20px; color:#000; font-weight:500; padding:16px 0px 20px;} .system_divide .Small .up p strong {font-size:18px; font-weight:600; } .system_divide .Small .up p.tit {font-size:20px; line-height:25px; color:#f390bb; font-weight:600;} .gap {padding-bottom:50px;} }