@charset "utf-8";

/* =========================== PAGE */
.pagecommon{font-size:17px;color:#666;line-height:1.8;font-family:'Pretendard'}
:root{--primary:#0061f2}

/* history1001 */
#history1001 .tit_area{margin-bottom:50px;font-size:20px;color:#777;text-align:center}
#history1001 .tit_area span{font-size:15px;font-weight:600;color:var(--primary);text-transform:uppercase;font-family:'Poppins'}
#history1001 .tit_area p{margin:5px 0 20px;font-size:42px;font-weight:700;color:#111}
#history1001 .bg{position:relative;height:440px;background:url(../img/sub/history1001_bg.jpg) fixed center no-repeat;background-size:cover}
#history1001 .bg .box{display:flex;flex-flow:column;justify-content:flex-end;position:absolute;left:calc((100% - 1200px) / 2);bottom:-35%;width:330px;height:260px;padding:0 0 45px 45px;font-size:18px;font-weight:600;color:rgba(255,255,255,.5);background:var(--primary)}
#history1001 .bg .box p{margin-top:20px;font-size:24px;font-weight:700;white-space:pre-line;line-height:1.4;color:#fff}
#history1001 .cont{position:relative;max-width:1200px;margin:0 auto;padding:60px 0 60px 330px}
#history1001 .cont:before{display:block;content:"";position:absolute;left:490px;top:0;bottom:0;width:1px;background:#e1e1e1}
#history1001 .cont dl{position:relative;padding-left:210px}
#history1001 .cont dl+dl{margin-top:70px}
#history1001 .cont dl dt{position:relative;margin-bottom:22px;font-size:32px;font-weight:800;color:#111;}
#history1001 .cont dl dt:before{display:block;content:"";position:absolute;left:-59px;top:19px;width:19px;height:19px;border-radius:50%;border:5px solid var(--primary);background:#fff}
#history1001 .cont dl dd{display:flex;align-items:baseline;line-height:1.65;word-break:keep-all}
#history1001 .cont dl dd+dd{margin-top:12px}
#history1001 .cont dl dd span{flex-shrink:0;width:35px;margin-right:20px;text-align:right;font-size:18px;font-weight:700;color:#111}

@media(max-width:1200px){
#history1001 .bg .box{left:0}
}
@media(max-width:1024px){
.pagecommon{font-size:16px}	
#history1001 .tit_area{font-size:18px}	
#history1001 .tit_area p{font-size:36px}
#history1001 .bg{height:350px}
#history1001 .bg .box{width:300px}
#history1001 .cont{padding-left:200px}
#history1001 .cont:before{left:360px}
#history1001 .cont dl dt{font-size:28px}
#history1001 .cont dl dt:before{top:16px}
#history1001 .cont dl dd span{font-size:17px}
}
@media(max-width:768px){
#history1001{font-size:15px}
#history1001 .tit_area{margin-bottom:30px;font-size:16px}
#history1001 .tit_area span{font-size:13px}	
#history1001 .tit_area p{font-size:32px}
#history1001 .bg{z-index:1;background-attachment:local}
#history1001 .bg .box{bottom:-20px;width:max-content;max-width:100%;height:auto;padding:30px 35px;font-size:16px}
#history1001 .bg .box p{margin-top:0;font-size:22px;font-weight:600;white-space:normal;word-break:keep-all}
#history1001 .cont{padding:60px 0 40px}
#history1001 .cont:before{left:25px}
#history1001 .cont dl{padding-left:50px}
#history1001 .cont dl+dl{margin-top:40px}
#history1001 .cont dl dt{margin-bottom:12px;font-size:22px}
#history1001 .cont dl dt:before{left:-32px;top:12px;width:15px;height:15px;border-width:4px}
#history1001 .cont dl dd span{width:32px;margin-right:15px;font-size:16px}
}
@media(max-width:480px){
#history1001 .tit_area p{margin:0 0 10px;font-size:30px}	
#history1001 .bg .box{padding:20px 25px}
#history1001 .bg .box p{font-size:20px}
}


/* 여기 아래로 부터 location1002 폴더에 있는 css 복사해서 붙여넣어주세요 */
:root{--primary:#f54500;--second:#102e48;--mainsize:1460px;--enfont:'Wix Madefor Display'}
.pagecommon{font-size:18px;color:#777;line-height:1.65;font-family:'Pretendard'}
.pagecommon .br{white-space:pre-line}

#location1002{overflow:hidden}
#location1002 .top_area{overflow:hidden;display:flex;align-items:center;position:relative;height:750px;background:#111}
#location1002 .top_area .bg{opacity:0;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(1.1);width:100%;height:100%;background:url(../img/sub/location1002_top_bg.jpg) center no-repeat;background-size:cover}
#location1002 .top_area .bg.on{opacity:1;transform:translate(-50%,-50%) scale(1);transition:all 1s}
#location1002 .top_area .txt{position:absolute;z-index:1;left:calc((100% - var(--mainsize)) / 2);font-size:20px;color:rgba(255,255,255,.6)}
#location1002 .top_area .txt p{margin-bottom:35px;font-size:56px;font-weight:100;color:#fff;line-height:1.25;letter-spacing:-.5px}
#location1002 .top_area .txt p b{font-weight:700}
#location1002 .top_area .txt span{display:block}
#location1002 .top_area .scroll{display:flex;flex-flow:column;align-items:center;position:absolute;left:50%;bottom:50px;z-index:1;transform:translateX(-50%);font-size:12px;color:#fff;font-family:var(--enfont)}
#location1002 .top_area .scroll svg{width:20px;height:20px;animation:scroll 1s infinite linear}
@keyframes scroll{from{opacity:0;transform:translateY(0)}50%{opacity:1;transform:translateY(6px)}100%{opacity:0;transform:translateY(12px)}}
#location1002 .cont{max-width:var(--mainsize);margin:0 auto;padding:200px 30px}
#location1002 .cont .grid{display:grid;grid-template-columns:65% 1fr;grid-template-rows:repeat(2, 1fr);height:660px}
#location1002 .cont .map{grid-row:span 2;position:relative;background:url(../img/sub/location1002_map.jpg) center no-repeat}
#location1002 .cont .map .pin{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:150px;padding:15px 0;border-radius:30px;font-size:16px;font-weight:600;color:#fff;text-align:center;background:var(--primary)}
#location1002 .cont .map .pin:after{display:block;content:"";position:absolute;left:calc(50% - 7px);bottom:-5px;transform:translateX(-50%);width:15px;height:15px;transform:rotate(45deg);background:var(--primary)}
#location1002 .cont .info{display:flex;flex-flow:column;padding:60px 0 60px 15%;color:#fff;background:var(--second)}
#location1002 .cont .info dl+dl{margin-top:auto}
#location1002 .cont .info dl dt{margin-bottom:10px;font-weight:800;color:var(--primary);font-family:var(--enfont)}
#location1002 .cont .info dl dd{word-break:keep-all}
#location1002 .cont .info dl dd span{display:inline-block;margin-right:15px}
#location1002 .cont .contact{display:flex;flex-flow:column;padding:60px 0 60px 15%}
#location1002 .cont .contact p{margin-bottom:15px;font-size:28px;font-weight:800;color:#111;font-family:var(--enfont)}
#location1002 .cont .contact a{display:flex;align-items:center;justify-content:center;width:200px;height:58px;margin-top:auto;padding-right:5px;border:1px solid var(--primary);font-size:17px;font-weight:600;color:Var(--primary);transition:all .3s}
#location1002 .cont .contact a svg{width:18px;height:18px;margin-right:5px}
@media(hover:hover){
#location1002 .cont .contact a:hover{color:#fff;background:var(--primary)}	
}
@media(max-width:1460px){
#location1002 .top_area .txt{left:50px}	
}
@media(max-width:1320px){
#location1002 .cont ul li{width:calc((100% - 460px) / 2)}
#location1002 .cont ul li .br{white-space:normal;word-break:keep-all}
}
@media(max-width:1024px){
.pagecommon{font-size:17px}
#location1002 .top_area{height:620px}
#location1002 .top_area .txt{left:30px;font-size:18px}
#location1002 .top_area .txt p{font-size:46px}
#location1002 .cont{padding:120px 20px}
#location1002 .cont .grid{height:550px;grid-template-columns:60% 1fr}
#location1002 .cont .info, #location1002 .cont .contact{padding:40px 0 40px 30px}
#location1002 .cont .contact p{font-size:24px}
#location1002 .cont .contact a{width:160px;height:50px;font-size:16px}
}
@media(max-width:768px){
.pagecommon{font-size:15px}
#location1002 .top_area{height:420px}
#location1002 .top_area .txt{left:20px;right:20px;font-size:16px;word-break:keep-all}
#location1002 .top_area .txt p{margin-bottom:20px;font-size:32px;word-break:keep-all}
#location1002 .top_area .scroll{bottom:30px}
#location1002 .cont{padding:80px 20px}
#location1002 .cont .map .pin{width:120px;padding:10px 0}
}
@media(max-width:680px){
#location1002 .cont .grid{grid-template-columns:1fr 1fr;grid-template-rows:60% 1fr;height:700px}
#location1002 .cont .grid .map{grid-column:span 2;grid-row:unset}
#location1002 .cont .info, #location1002 .cont .contact{padding:30px 0 30px 20px}
#location1002 .cont .contact p{font-size:20px}
#location1002 .cont .contact .br{white-space:normal;word-break:keep-all}
}
@media(max-width:480px){
#location1002 .cont .grid{display:block}
#location1002 .cont .grid .map{height:320px}
#location1002 .cont .info dl+dl{margin-top:30px}
#location1002 .cont .contact{padding:40px 0;text-align:center}
#location1002 .cont .contact a{margin:20px auto 0}
}

@charset "utf-8";

/* =========================== PAGE */
#greeting1007{position:relative;padding-bottom:50px;font-size:15px;text-align:center;letter-spacing:-.3px;line-height:1.8;color:#777;font-family:'Pretendard'}
#greeting1007 *{word-break:keep-all}
#greeting1007 .pl{white-space:pre-line}
#greeting1007 .pg_color{color:#333}
#greeting1007 .pg_bdcolor:before{border-color:#333}
#greeting1007 .pg_bgcolor{background-color:#333}

/* 공통 */
#greeting1007 .tit_area{margin-bottom:25px;font-weight:200;color:#aaa;letter-spacing:-.8px}
#greeting1007 .tit_area span{font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;font-family:'Poppins'}
#greeting1007 .tit_area.t_center span:after{display:block;content:"";width:1px;height:30px;margin:12px auto;background-color:#d1d1d1}
#greeting1007 .tit_area p{font-size:29px;line-height:1.4}
#greeting1007 .tit_area b{font-weight:700}
#greeting1007 .cont_area{padding-top:250px;;background-size:contain;background:url(../img/sub/greeting1007_img.jpg) no-repeat center top}
#greeting1007 .cont{padding-top:50px;width:90%;margin:0 auto;background-color:#fff}
#greeting1007 .cont .st{padding-bottom:10px;font-size:22px;font-weight:500;letter-spacing:-.8px;color:#333;}
#greeting1007 .cont .sign{margin-top:20px;font-weight:700;color:#333}
#greeting1007 .cont .sign span{padding-left:5px;font-size:26px;color:#333;font-family:'Handletter'}

@media(max-width:1024px){
#greeting1007{padding-bottom:30px}
#greeting1007 .cont .st{font-size:20px}
}
@media(max-width:768px){
#greeting1007 .pl{white-space:normal}
#greeting1007 .tit_area p{font-size:25px}
}
@media(max-width:480px){
#greeting1007 .tit_area p{font-size:22px}
#greeting1007 .cont_area{padding-top:180px}
#greeting1007 .cont{width:100%;padding:20px}
}

.pagecommon{position:relative;font-size:16px;color:#777;font-family:'pretendard'}
.pagecommon .pl{white-space:pre-line}
.pagecommon *{word-break:keep-all}
.pagecommon .inner{max-width:var(--mainsize);margin:0 auto}

#about1017 .tit{position:relative;display:grid;grid-template-columns:repeat(2,1fr);padding:150px 50px 150px 80px;border-left:1px solid #e1e1e1;border-right:1px solid #e1e1e1}
#about1017 .tit:after{position:absolute;content:'';top:0;left:50%;width:1px;height:100%;background:#e1e1e1;transform:translateX(-50%)}
#about1017 .tit .slo span{font-size:13px;font-weight:700;color:#111;font-family:var(--e-font)}
#about1017 .tit .slo h1{font-size:35px;font-weight:300;color:#111;line-height:1.2}
#about1017 .tit .slo h1 b{font-weight:700}
#about1017 .tit .txt{margin-top:250px;padding-left:70px}
#about1017 .tit .txt dl{margin-top:100px}
#about1017 .tit .txt dt{margin-bottom:10px;font-size:22px;font-weight:700;color:#111;font-family:var(--e-font)}

#about1017 .cont{position:relative}
#about1017 .cont ul{display:flex;height:600px;text-align:center}
#about1017 .cont ul li{width:33.33%;transition:all .3s}
#about1017 .cont ul li+li{border-left:1px solid rgba(255,255,255,.1)}
#about1017 .cont a{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:center;width:100%;height:100%;color:#fff;transition:all .3s}
#about1017 .cont h2{font-size:22px;font-weight:700}
#about1017 .cont p{font-size:13px;font-weight:700;font-family:var(--e-font)}
#about1017 .cont li .wrap{margin-top:100px;transition:all .3s}
#about1017 .cont li .pl{margin-top:20px;opacity:0;transition:all .3s}

#about1017 .hov_bg{overflow:hidden;position:absolute;z-index:-1;top:0;left:0;width:100%;height:100%;background:#111}
#about1017 .hov_bg img{width:100%;height:100%;filter:brightness(.7)}

@media(hover:hover){
#about1017 .cont ul li:hover{width:50%}
#about1017 .cont ul li:hover .wrap{margin-top:0}
#about1017 .cont ul li:hover a{background:rgba(0,0,0,.5)}
#about1017 .cont ul li:hover .pl{opacity:.5}
}

@media(max-width:1024px){
.pagecommon{font-size:15px}
#about1017 .tit{border:none;padding:100px 50px}
#about1017 .tit:after{display:none}
#about1017 .tit .slo h1{font-size:30px}
#about1017 .tit .txt{margin-top:50px;padding-left:0}
#about1017 .tit .txt dt{font-size:20px}
#about1017 .cont h2{font-size:18px}
}
@media(max-width:768px){
.pagecommon{font-size:14px}
#about1017 .tit .slo h1{font-size:25px}
#about1017 .cont ul{display:block}
#about1017 .cont ul li{position:relative;width:100%;background-position:center;background-size:cover}
#about1017 .cont ul li+li{border-left:none}
#about1017 .cont li:after{position:absolute;content:'';top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5)}
#about1017 .cont li:nth-child(1){background-image:url(../img/sub/about1017_img01.jpg)}
#about1017 .cont li:nth-child(2){background-image:url(../img/sub/about1017_img02.jpg)}
#about1017 .cont li:nth-child(3){background-image:url(../img/sub/about1017_img03.jpg)}
#about1017 .cont a{padding:100px 0}
#about1017 .cont li .wrap{margin-top:0}
#about1017 .cont li .pl{opacity:.5}
#about1017 .hov_bg{display:none}
}
@media(max-width:480px){
.pagecommon .pl{white-space:normal}
#about1017 .tit{display:block;padding:75px 15px;text-align:center}
#about1017 .tit .txt dl{margin-top:50px}
#about1017 .tit .txt dt{font-size:17px}
}
@media(max-width:390px){
#about1017 .tit .slo h1{font-size:22px}
}
/* =========================== PAGE */
.pagecommon{position:relative;padding-bottom:150px;font-size:15px;line-height:1.5;color:#777}
.pagecommon .pl{white-space:pre-line}
.pagecommon *{word-break:keep-all}
.pagecommon .inner{max-width:var(--mainsize);margin:0 auto;padding:150px 0}

#business1018 .tit h2{font-size:35px;font-weight:700;color:#111;line-height:1.3}

#business1018 .intro .tit{display:flex;justify-content:space-between;align-items:flex-end}
#business1018 .intro .img_slider{margin-top:100px}
#business1018 .intro .arrow{display:flex;justify-content:flex-end;gap:5px;margin-bottom:20px}
#business1018 .intro .arrow span{display:flex;align-items:center;justify-content:center;width:60px;height:60px;border:1px solid #e1e1e1;border-radius:50px;color:#111;cursor:pointer;transition:all .3s}
#business1018 .intro .arrow svg{width:20px}
#business1018 .intro li{text-align:center}
#business1018 .intro li div{overflow:hidden;border-radius:10px}
#business1018 .intro li img{width:100%;transition:all .3s}
#business1018 .intro li h3{margin-top:15px;font-size:17px;font-weight:600;color:#111}

#business1018 .stck{background:#f2f2f2}
#business1018 .stck .inner{display:flex;justify-content:space-between}
#business1018 .stck h3{font-size:22px;font-weight:700;color:#111}

#business1018 .stck .tit{position:sticky;top:100px;height:100%}
#business1018 .stck .cate{margin-top:100px}
#business1018 .stck .cate li{display:flex;align-items:center;color:#777}
#business1018 .stck .cate li+li{margin-top:10px}
#business1018 .stck .cate li span{opacity:0;font-size:13px;font-weight:700;font-family:'play'}
#business1018 .stck .cate li p{margin-left:-15px;font-size:17px;font-weight:700;transition:all .3s}
#business1018 .stck .cate li.on{color:#111}
#business1018 .stck .cate li.on span{opacity:1}
#business1018 .stck .cate li.on p{margin-left:5px}


#business1018 .stck .r_cont{width:50%}
#business1018 .stck .r_cont li+li{margin-top:150px}
#business1018 .stck .r_cont span{font-size:13px;font-weight:700;color:#aaa;font-family:'play'}
#business1018 .stck .r_cont img{border-radius:10px}
#business1018 .stck .r_cont dl{margin-top:50px}
#business1018 .stck .r_cont dt{margin-bottom:20px}

@media(hover:hover){
#business1018 .intro li a:hover img{transform:scale(1.1)}
#business1018 .intro .arrow span:hover{border:1px solid #111}
}

@media(max-width:1024px){
.pagecommon .inner{padding:100px 15px}
#business1018 .tit h2{font-size:30px}
#business1018 .intro .tit{flex-wrap:wrap}
#business1018 .intro .tit div+div{margin-top:30px}
#business1018 .stck .r_cont img{width:100%}
#business1018 .stck h3{font-size:20px}
}
@media(max-width:768px){
.pagecommon{font-size:14px}
.pagecommon .inner{padding:80px 15px}
#business1018 .tit h2{font-size:26px}
#business1018 .intro .tit{display:block;text-align:center}
#business1018 .intro .tit div+div{margin-top:20px}
#business1018 .intro .arrow{justify-content:center}
#business1018 .intro .img_slider{margin-top:50px}
#business1018 .intro li h3{font-size:15px}

#business1018 .stck .tit{position:unset;text-align:center}
#business1018 .stck .cate{display:none}
#business1018 .stck .inner{display:block}
#business1018 .stck .r_cont{width:100%;margin-top:50px}
#business1018 .stck .r_cont dl{margin-top:30px;text-align:center}
#business1018 .stck h3{font-size:18px}
#business1018 .stck .r_cont li+li{margin-top:50px}
}
@media(max-width:480px){
#business1018 .tit h2{font-size:22px}
#business1018 .intro .img_slider{margin-top:30px}
#business1018 .stck h3{font-size:17px}
}
@media(max-width:390px){
#business1018 .tit h2{font-size:20px}
#business1018 .stck .r_cont dt{margin-bottom:10px}
}
