@charset "utf-8";

#comingsoon{width:100%;padding-top:100px;text-align:center}

/* 페이지 포인트 컬러 */
#pageCm .pg_color{color:#333}
#pageCm .pg_bdcolor:before{border-color:#333}
#pageCm .pg_bgcolor{background-color:#333}

/* 공통 */
#pageCm{padding-bottom:50px;position:relative;font-size:15px;letter-spacing:-.3px;line-height:1.8;color:#777;font-family:'notokr-regular'}
#pageCm .tit_area{margin-bottom:25px;color:#aaa;letter-spacing:-.8px;font-family:'notokr-light'}
#pageCm .tit_area span{display:inline-block;font-size:14px;letter-spacing:2px;text-transform:uppercase;font-family:'notokr-bold'}
#pageCm .tit_area.t_center span:after{display:block;content:"";width:1px;height:30px;margin:12px auto;background-color:#d1d1d1}
#pageCm .tit_area p{font-size:29px;line-height:1.4}
#pageCm .t_center{padding:30px;text-align:center}
#pageCm .t_center p{word-break:keep-all}
#pageCm .c_black{color:#333}
#pageCm strong{font-weight:normal;font-family:'notokr-bold'}
#pageCm .stit_area{font-size:17px;line-height:1.6}
#pageCm .stit_area h4{padding-bottom:15px;font-size:29px;font-weight:normal;line-height:1.4;font-family:'notokr-regular'}

/* 브랜드소개 */
#p36{font-size:18px;line-height:1.8;word-break:keep-all;color:#777;font-family:var(--prefont)}
#p36 .pl{white-space:pre-line;line-height:1.5}
#p36 .top_bg{width:100%;height:407px;padding:80px 150px;background:url(/sh_page/img/p36_img03.jpg) no-repeat;background-position:top}
#p36 .top_bg p{font-size:35px;font-weight:300;color:#222;line-height:1.4}
#p36 .top_bg p span{font-weight:700}
#p36 .tit_area b{display:block;position:relative;padding-bottom:30px;margin-bottom:50px;font-size:30px;font-weight:700;color:#222;text-transform:uppercase;text-align:center;font-family:var(--pop)}
#p36 .tit_area b::before{content:"";display:block;position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:50px;height:2px;background:var(--greenbg)}
#p36 .tit_area p{font-size:40px;color:#222;line-height:1.5}
#p36 .greeting{position:relative;padding:80px 120px 290px;margin:-100px 0 0}
#p36 .greeting::before{content:"";display:block;position:absolute;bottom:0;left:0;width:100%;height:882px;background:url(/sh_page/img/p36_img01.jpg) #fff no-repeat;background-position:bottom}
#p36 .greeting .g_wrap{position:relative;margin:-100px 0 0;padding:100px 0;background:#fff}
#p36 .greeting .txt{width:665px;margin:0 auto;padding:40px 10px;font-size:22px;line-height:1.6;color:#222}
#p36 .greeting .txt span{font-weight:700;color:#222}
#p36 .greeting .txt b{display:block;padding-top:48px;font-size:20px;font-weight:normal;color:#222;text-align:right}
#p36 .greeting .txt br{display:none}
#p36 .slogan .tit_area{position:relative;padding:100px 20px 50px;background:#fff}
#p36 .slogan .tit_area span{display:block;font-size:17px;font-weight:500;color:var(--greenbg);text-align:center;font-family:var(--greenbg)}
#p36 .slogan .s_txt{text-align:center}
#p36 .slogan .s_txt p{padding-bottom:20px;font-size:40px;color:#222;font-weight:700;text-transform:uppercase}
#p36 .slogan .s_txt span{font-size:24px;font-weight:700}
#p36 .values{margin:150px 0 50px;padding:100px 0;background:#f7f7f7}
#p36 .values .tit_area span{display:block;padding-top:10px}
#p36 .values ul{display:flex;align-items:center;justify-content:center;padding-top:35px}
#p36 .values ul li .circle{display:flex;align-items:center;justify-content:center;width:250px;height:250px;transform:rotate(45deg);border-radius:100% 100% 0 100%;border:2px dotted var(--greenbg);background:#fff}
#p36 .values ul li .circle div{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;transform:rotate(-45deg)}
#p36 .values ul li .circle div b{display:block;font-weight:700;text-align:center;color:#222;text-align:center}
#p36 .values ul li .circle.se_cir{border:none;background:var(--greenbg)}
#p36 .values ul li .circle.se_cir div b{color:#fff}
#p36 .values ul li > p{padding-top:26px;font-size:22px;font-weight:700;color:#898989;text-align:center}
#p36 .values ul li:last-child p{padding-left:20px}
#p36 .vision{display:flex;align-items:center;justify-content:center;flex-direction:column}
#p36 .vision .tit_area{position:relative;width:90%;z-index:1;margin:0 auto;padding:100px 20px 0;background:#fff}
#p36 .vision .tit_area p{font-weight:700;line-height:1.6;text-align:center}
#p36 .vision .tit_area p strong{font-size:39px;color:var(--greenbg);text-transform:uppercase}






/* 반응형 [s] */
@media (max-width:1300px){

}
@media (max-width:1200px){
#p36 .greeting{padding:80px 80px 290px}
#p36 .top_bg{padding:80px}
}
@media (max-width:1024px){
#pageCm{padding:60px 0 30px;font-size:14px}
/* #pageCm .tit_area{padding:0 20px}
#pageCm .tit_area span{font-size:12px}
#pageCm .tit_area p{font-size:24px;word-break:keep-all}
#pageCm .stit_area{padding:0 20px;font-size:14px;word-break:keep-all}
#pageCm .stit_area h4{font-size:24px} */
#p36 .greeting{padding:80px 30px}
#p36 .greeting .txt{width:initial;padding:0 30px;font-size:16px}
#p36 .top_bg p{font-size:30px}
#p36 .top_bg{height:362px}
#p36 .greeting .g_wrap{padding:53px 0}
#p36 .tit_area b{padding-bottom:20px;margin-bottom:20px;font-size:20px}
#p36 .greeting .txt b{font-size:16px}
#p36 .greeting::before{height:282px}
}
@media (max-width:900px){

}
@media (max-width:768px){
#p36 .slogan .s_txt p{font-size:30px;line-height:1.5}
#p36 .slogan .s_txt span{font-size:21px}
#p36 .slogan .tit_area{padding:80px 20px 30px}
#p36 .values{margin-top:80px;padding:80px 0;margin-bottom:0}
#p36 .values ul{padding:35px}
#p36 .values ul li img{width:100%}
#p36 .values ul li > p{font-size:16px}
#p36 .vision .tit_area p{font-size:30px;line-height:1.5}
#p36 .vision .tit_area{padding:80px 0 30px}
}
@media (max-width:650px){
#p36 .top_bg p{font-size:27px;white-space:normal}
#p36 .top_bg{height:272px;padding:50px 15px}
#p36 .greeting .txt{padding:0 40px;white-space:normal}
#p36 .greeting .txt br{display:block}
#p36 .greeting .txt > span{display:block;padding:10px 0}
#p36 .slogan .s_txt p{font-size:27px}
#p36 .slogan .s_txt span{display:block;font-size:16px;font-weight:500;line-height:1.6}
#p36 .tit_area b{padding-bottom:43px;margin-bottom:53px;font-size:17px;background:#fff}
#p36 .greeting .g_wrap .tit_area b{padding-top:53px}
#p36 .slogan .tit_area{padding-bottom:25px}
#p36 .slogan .s_txt p{padding-bottom:15px}
#p36 .values ul{padding-bottom:0}
#p36 .values ul li > p{font-size:14px;line-height:1.5}
#p36 .vision .tit_area p{font-size:27px;white-space:normal}
#p36 .vision .tit_area p strong{font-size:30px}
#p36 .tit_area b::before{width:37px}
#p36 .greeting .g_wrap{background:transparent;padding-top:0}
#p36 .greeting:after{content: "";position: absolute;bottom:0;left:0;width:100%;height:300px;background:linear-gradient(to top,  rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);z-index: 1;pointer-events: none}
#p36 .greeting .txt{position:relative;z-index:2}
}
@media (max-width:480px){
    #p36 .values{margin-bottom:0}
#p36 .values ul{flex-direction:column;gap:25px}
#p36 .values ul li > p{padding-top:20px;font-size:20px}
#p36 .vision .tit_area p{font-size:24px}
#p36 .vision .tit_area p strong{font-size:24px}
#p36 .vision .tit_area{padding-bottom:80px}
#p36 .greeting .txt{padding:0;font-weight:500}

}
@media (max-width:480px){
#pageCm .br{white-space:normal}
#p36 .greeting{padding:80px 15px}
#p36 .top_bg p{font-size:26px}
#p36 .top_bg{height:297px}
#p36 .slogan .s_txt p{font-size:24px}
#p36 .greeting{margin-top:-84px}

}
/* 반응형 [e] */