@charset "utf-8";

/* 기본 좌우 정렬 */
.divide_hor { display:flex; justify-content:space-between; flex-wrap:wrap; }
.divide_hor .pic { width:35%;}
.divide_hor .pic img { width:100%; }
.divide_hor .desc { margin:auto 0; width:60%; }
.divide_hor .desc h1 { display:block; margin:0 0 15px; font-size:1.7em; color:#164681; line-height:1.5em; }
.divide_hor .desc p { text-align:left; }

.divide3_pic { display:flex; justify-content:space-between; flex-wrap:wrap; height:100%; }
.divide3_pic .content { border-bottom:0px solid #dedede; width:31%; margin:0; overflow:hidden; }
.divide3_pic .content img { width:100%; margin:0 auto; }

.divide4_pic { display:flex; justify-content:space-between; flex-wrap:wrap; height:100%; }
.divide4_pic .content { border-bottom:0px solid #dedede; width:23.5%; margin:0; overflow:hidden; }
.divide4_pic .content img { width:100%; margin:0 auto; }

.divide4 { display:flex; justify-content:space-between; flex-wrap:wrap; height:100%;}
.divide4 .content { border-bottom:1px solid #dedede; width:23.5%; margin:0 0 1.8%; overflow:hidden; }
.divide4 .content .pic { display:block; text-align:center; }
.divide4 .content .pic img { width:100%; margin:0 auto; }
.divide4 .content .desc { display:block; border-left:1px solid #dedede; border-right:1px solid #dedede; height:90%; padding:5%; font-size:1.1em;}
.divide4 .content .desc h1 { display:block; margin:0 0 10px; font-size:1.5em; font-weight:600; color:#07439f; text-align:center; }
.divide4 .content .desc p { text-align:center; }

.divide4_tit { display:flex; justify-content:space-between; flex-wrap:wrap; height:100%; }
.divide4_tit .content { border-bottom:1px solid #dedede; width:23.5%; overflow:hidden; }
.divide4_tit .content h1 { background:#69c11e; padding:12px 0; font-size:1.2em; font-weight:; color:#fff; text-align:center; }
.divide4_tit .content span { display:block; border-left:1px solid #dedede; border-right:1px solid #dedede; height:90%; padding:5%; text-align:center; }



/* 공통 */
.mh_story { font-size:16px; color:#222; background:#fff; overflow:hidden; }
.mh_story *, .mh_story *::before, .mh_story *::after { box-sizing:border-box; }
.mh_story img { max-width:100%; display:block; }
.mh_story .eyebrow { font-weight:800; letter-spacing:0; font-size:1.3em; }
.mh_story .eyebrow_red { color:#d81f26; }
.mh_story .eyebrow_white { color:#fff; }

/* 상단 헤더 */
.mh_story .mh_head { position:relative; padding:40px 0 52px; background:linear-gradient(180deg,#f7f8fa 0%,#eceff3 100%); text-align:center; }
.mh_story .mh_head_bg { position:absolute; top:0; left:0; right:0; bottom:0; overflow:hidden; z-index:0; }
.mh_story .photo { position:absolute; top:0; bottom:0;  width:30%; overflow:hidden;  }
.mh_story .photo img { width:100%; height:100%; object-fit:contain; object-position:bottom; }
.mh_story .photo_left { left:0; }
.mh_story .photo_left img { object-position:left bottom; }
.mh_story .photo_right { right:0;}
.mh_story .photo_right img { object-position:right bottom; }
.mh_story .mh_head_cont { position:relative; z-index:1; max-width:720px; margin:0 auto; }
.mh_story .logo_main { width:330px; max-width:50%; margin:0 auto 26px; }
.mh_story .headline { margin:0 0 18px; font-size:2.4em; font-weight:700; color:#164681; position:relative; padding-bottom:16px; line-height:1.3em; }
.mh_story .headline::after { content:""; position:absolute; left:50%; bottom:0; width:46px; height:4px; margin-left:-23px; background:#d81f26; border-radius:2px; }
.mh_story .lede { margin:0; color:#333; font-size:1.2em; line-height:1.5; }
.mh_story .lede strong { color:#164681; }

/* 본문 : 좌/우 패널 (배너 + 내용이 한 덩어리) */
.mh_story .mh_body { display:flex; flex-wrap:wrap; }
.mh_story .mh_panel { display:flex; flex-direction:column; width:50%; }
.mh_story .panel_left { background:#f6f6f6; }
.mh_story .panel_right { background:linear-gradient(160deg,#164681 0%,#0d2f5c 65%,#08203f 100%); color:#c9d2e3; border-left:1px solid rgba(255,255,255,0.08); }

/* 각 패널 상단 배너 (수직선으로 구분) */
.mh_story .banner { display:flex; flex-direction:column; justify-content:center; min-height:100px; padding:10px 48px; background: #e3e3e4; text-align: center; }
.mh_story .banner .b_tit { margin-top:0; font-size:1.1em; font-weight:500; color:#164681; }
.mh_story .banner .b_tit_white { color:#e0e1ec; }
.mh_story .panel_right .banner { background:rgba(0,0,0,0.18); }

/* 패널 내용 */
.mh_story .panel_cont { flex:1; padding:48px; }
.mh_story .col_tit { margin:0 0 16px; font-size:1.5em; font-weight:800; display:flex; align-items:center; flex-wrap:wrap; gap:12px; line-height:1.3em; }
.mh_story .col_tit_red { color:#d81f26; }
.mh_story .col_tit_white { color:#fff; }
.mh_story .logo_chip { display:inline-flex; align-items:center;  }
.mh_story .logo_inline { width:100px; }
.mh_story .col_txt { margin:0 0 32px; color:#333; font-size:1.1em; line-height:1.5; }
.mh_story .col_txt_light { color:#c9d2e3; }

/* 타임라인 */
.mh_story .timeline { list-style:none; margin:0; padding:0 0 0; display:flex; flex-wrap:wrap; justify-content:space-between; position:relative; }
.mh_story .timeline::before { content:""; position:absolute; top:8px; left:0; right:6%; height:2px; background:#e2e2e2; }
.mh_story .tl_item { position:relative; width:30%; padding-top:28px; }
.mh_story .tl_dot { position:absolute; top:0; left:0; width:16px; height:16px; background:#fff; border:3px solid #164681; border-radius:50%; }
.mh_story .tl_year { display:block; margin-bottom:0; font-size:1.2em; font-weight:800; color:#164681; }
.mh_story .tl_tit { display:block; margin-bottom:7px; font-size:1.1em; font-weight:700; color:#222; }
.mh_story .tl_desc { margin:0; font-size:0.95em; line-height:1.5; color:#111; }

/* 우측 기능 아이콘 (아이콘은 PNG 이미지) */
.mh_story .features { display:flex; flex-wrap:wrap; }
.mh_story .feature { width:25%; text-align:center; padding:0 14px; }
.mh_story .f_icon { display:inline-flex; align-items:center; justify-content:center; width:56px; height:56px; margin-bottom:14px; }
.mh_story .f_icon img { width:100%; height:100%; object-fit:contain; }
.mh_story .f_tit { display:block; margin:0 0 10px; font-size:1.05em; font-weight:700; color:#fff; }
.mh_story .f_desc { margin:0; font-size:0.85em; line-height:1.6em; color:#c9d2e3; }

/* 하단 푸터 */
.mh_story .mh_foot { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:100px; padding:40px 40px; background:#fff; border-top:1px solid #eee; }
.mh_story .values { flex:1;  }
.mh_story .values_lab { display:block; margin-bottom:16px; padding-bottom:10px; font-size:0.8em; font-weight:700; letter-spacing:0.06em; color:#666; border-bottom:2px solid #164681; }
.mh_story .values_list { display:flex; flex-wrap:wrap; gap:20px; justify-content: space-between; }
.mh_story .value { display:flex; flex-direction:column; align-items:center; gap:8px; width:64px; }
.mh_story .v_icon { display:inline-flex; align-items:center; justify-content:center; width:50px; height:50px; }
.mh_story .v_icon img { width:100%; height:100%; object-fit:contain; }
.mh_story .v_lab { font-size:0.62em; font-weight:700; letter-spacing:0.03em; color:#666; text-align:center; }
.mh_story .quote { flex:1.5; padding:0 24px; text-align:center; border-left:1px solid #eee; border-right:1px solid #eee; }
.mh_story .quote_txt { margin:0 0 14px; font-size:1.2em; font-weight:700; color:#164681; line-height:1.6em; }
.mh_story .quote_mark { color:#d81f26; font-size:1.3em; font-weight:900; }
.mh_story .quote_tag { margin:0; font-size:0.78em; letter-spacing:0.05em; color:#666; }
.mh_story .quote_tag strong { color:#d81f26; }
.mh_story .brand { flex:0.5;display:flex; flex-direction:column; align-items:flex-end; gap:8px; }
.mh_story .brand_logo { width:150px; }
.mh_story .brand_name { font-size:0.85em; font-weight:700; color:#222; }



.mh_guide { font-size:16px; color:#222; background:#fff;  }
.mh_guide *, .mh_guide *::before, .mh_guide *::after { box-sizing:border-box; }
.mh_guide img { max-width:100%; display:block; }
.mh_guide .g_inner {  margin:0 auto; }



/* 2단 레이아웃 */
.mh_guide .g_cols { display:flex; flex-wrap:wrap; justify-content:space-between; }
.mh_guide .g_col_l { width:40%; }
.mh_guide .g_col_r { width:50%; }

/* 섹션 공통 */
.mh_guide .g_sec { margin-bottom:80px; }
.mh_guide .g_sec_tit { margin:0 0 30px; padding-bottom: 10px; font-size:1.25em; font-weight:800; color:#222; border-bottom: 1px #ccc solid; }
.mh_guide .g_sec_tit .fname { font-weight:400;  }


/* 1) 로고 구성 타입 */
.mh_guide .lt_item { margin-bottom:8px; }
.mh_guide .lt_lab { display:block; margin-bottom:10px; font-size:0.9em; font-weight:700; color:#555; }
.mh_guide .lt_lab::before { content:"—  "; color:#0A2752; font-size:0.7em; vertical-align:middle; }
.mh_guide .lt_box { padding:8px 4px; }
.mh_guide .lt_box img { width:55%; }
.mh_guide .lt_divider { height:0; margin:22px 0; border-top:1px dashed #cfd4dc; }

/* 3) 색상 다양화 */
.mh_guide .var_grid { display:flex; flex-wrap:wrap; gap:16px; margin-top:6px; }
.mh_guide .var_card { width:calc(50% - 8px); display:flex; align-items:center; justify-content:center; padding:22px 18px; border:1px solid #eee; border-radius:4px; }
.mh_guide .var_card img { width:76%; }
.mh_guide .var_card.on_white { background:#fff; }
.mh_guide .var_card.on_navy  { background:#0A2752; border-color:#0A2752; }
.mh_guide .var_card.on_red   { background:#ED1C24; border-color:#ED1C24; }
.mh_guide .var_card.on_black { background:#000; border-color:#000; }
.mh_guide .var_card.on_gray  { background:#595757; border-color:#595757; }

/* 2) 색상 */
.mh_guide .color_list { display:flex; flex-direction:column; gap:16px; }
.mh_guide .color_row { display:flex; align-items:center; gap:22px; }
.mh_guide .cr_name { width:90px; flex-shrink:0; font-size:1em; font-weight:700; color:#222; line-height:1.35em; }
.mh_guide .cr_swatch { width:120px; height:64px; flex-shrink:0; border-radius:3px; }
.mh_guide .cr_swatch.sw_navy { background:#0A2752; }
.mh_guide .cr_swatch.sw_red  { background:#ED1C24; }
.mh_guide .cr_swatch.sw_gray { background:#595757; }
.mh_guide .cr_val { font-size:1em; color:#555; line-height:1.7; }
.mh_guide .cr_val span { color:#999; }

/* 4) 시그니처 문구 폰트 */
.mh_guide .font_tit { margin:0 0 14px; font-size:1.25em; font-weight:800; color:#222; }
.mh_guide .font_tit .num { color:#ED1C24; margin-right:6px; }
.mh_guide .font_tit .fname { color:#0A2752; }
.mh_guide .fs_sample { margin:0 0 14px; font-family:"NanumSquare","Nanum Gothic",sans-serif; font-weight:400; font-size:2.6em; color:#0A2752; letter-spacing:0.01em; }
.mh_guide .fs_desc {  margin-top: 20px; font-size:1em; color:#444; line-height:1.7; }

/* 5) 디자인 GRID */
.mh_guide .grid_demo {
	display:flex; align-items:center; justify-content:center;
	padding:44px 40px;
	background-color:#fbfbfc;
	background-image:linear-gradient(#e7eaef 1px, transparent 1px), linear-gradient(90deg, #e7eaef 1px, transparent 1px);
	background-size:26px 26px;
	border:1px solid #eee;
}
.mh_guide .grid_demo img { width:88%; }




@media (min-width:1500px) {
	
/* 기능 아이콘 4개 : 붉은 세로 구분선 */
.mh_story .feature { border-left:1px solid rgba(216,31,38,0.5); }
.mh_story .feature:first-child { border-left:0; }
	
	
/* 레지디오 소개 */	
.about_1_1 { display:flex; justify-content:space-between; flex-wrap:wrap; border:1px solid #eee; }
.about_1_1 .pic { margin:auto 0; background:#fff; width:25%; padding:5%; }
.about_1_1 .pic img { width:100%;}
.about_1_1 .desc { background:#f6f6f6; width:55%; padding:5%;}
.about_1_1 .desc strong { color:#222; }

.about_1_2 {}
.about_1_2 .pic { display:block; margin:0 0 70px; }
.about_1_2 .pic img { width:100%; }
.about_1_2 .desc { display:flex; justify-content:space-between; flex-wrap:wrap; }
.about_1_2 .desc span { width:48%; }

/* 혁신의 역사 */
.about_1_3 { background:#f6f6f6; padding:100px 0; }	
.about_1_3 .title { text-align:center; }
.about_1_3 .title h1 { display:block; margin:0 0 15px; font-size:3.0em; font-weight:600; color:#222; line-height:1.5em; letter-spacing:0; }
.about_1_3 .title h2 { font-size:1.3em; font-weight:400; color:#222; line-height:1.5em; letter-spacing:0; }
.about_1_3 .content_wrap { width:90%; min-width:1500px; margin:0 auto; }	
.about_1_3 .content_wrap .content { display:flex; justify-content:space-between; flex-wrap:wrap; border-top:1px solid #dedede; margin:50px 0 0; padding:50px 0 0; }
.about_1_3 .content_wrap .content .pic { margin:auto 0; order:3; background:#fff; border-radius:20px; padding:2.5%; width:25%; text-align:center; }
.about_1_3 .content_wrap .content .pic img { width:80%; }
.about_1_3 .content_wrap .content .period { width:15%; margin:1% 0 0 0; font-family: 'GmarketSansBold'; font-size:2.4em; color:#d22730; }
.about_1_3 .content_wrap .content .desc { width:45%; padding:0 6% 0 4%; }
.about_1_3 .content_wrap .content .desc span { display:flex; margin:20px 0;}
.about_1_3 .content_wrap .content .desc span h1 { font-family: 'GmarketSansBold'; font-size:1.1em; color:#222; }
.about_1_3 .content_wrap .content .desc span ul { margin:-2px 0 0 20px; }


/* 우리의 가치 */
.about_2_1 { display:flex; justify-content:space-between; flex-wrap:wrap; background:url(../images/about_02_01.jpg) right no-repeat #d22730; background-size:50%; }
.about_2_1 .desc { margin:auto 0; width:38%; padding:7% 6%; }
.about_2_1 .desc span:nth-child(1) { display:block; margin:0 0 50px; }
.about_2_1 .desc h1 { display:block; margin:0 0 20px; font-family: 'SpoqaHanSansNeo-Bold'; font-size:2.0em; color:#fff; }
.about_2_1 .desc p { font-size:1.0em; color:#fff; }
.about_2_1 .pic { display:none; }

/* Our values */
.about_2_2 { }
.about_2_2 .content_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; margin:40px 0 0; }
.about_2_2 .content_wrap .content { width:21%; text-align:center; }
.about_2_2 .content_wrap .content .pic img { height:120px; }
.about_2_2 .content_wrap .content .desc { display:block; margin:10px 0 0; }
.about_2_2 .content_wrap .content .desc h1 { display:block; margin:0 0 30px; font-size:1.1em; font-weight:600; color:#222; text-decoration:underline; }

/* HISTORY OF INNOVATION IS IN OUR DNA */
.about_2_3 { background:#f6f6f6; padding:130px 0; }	
.about_2_3 .content_wrap { width:90%; min-width:1500px; margin:0 auto; }	
.about_2_3 .content_wrap .flow { display:block; margin:80px 0; text-align:center;}
.about_2_3 .content_wrap .flow img { width:100%; max-width:1700px;}
.about_2_3 .content_wrap .diagram { background:#fff; border-radius:30px; padding:5%; text-align:center; }
.about_2_3 .content_wrap .diagram img { width:100%; max-width:1700px;}

/* OUR BRANDS */
.about_2_4 { }
.about_2_4 .content_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; }
.about_2_4 .content_wrap .content { border-radius:30px 0 30px 0; border:1px solid #dedede; box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.0); margin:30px 0 0; width:40%; padding:4%; }
.about_2_4 .content_wrap .content .pic { display:block; border-bottom:1px solid #333; padding:0 0 30px 0; margin:0 0 50px; text-align:center; }
.about_2_4 .content_wrap .content .pic img { width:80%; padding:0 10%; }
.about_2_4 .content_wrap .content .desc { display:block; }
.about_2_4 .content_wrap .content .desc h1 { font-size:1.6em; font-weight:600; color:#222; }
.about_2_4 .content_wrap .content .desc span { display:block; margin:30px 0 0; }
.about_2_4 .content_wrap .content .desc span h2 { font-size:1.2em; color:#d22730; }
.about_2_4 .content_wrap .content .desc span p { display:block; margin:10px 0 0; }

/* RESIDEO – THE CONNECTED HOME */
.about_2_5 { margin:80px auto 0; width:100%; text-align:center; }
.about_2_5 img { width:100%; max-width:1200px; }

.about_2_6 { background:#f6f6f6; padding:130px 0; }	
.about_2_6 .content_wrap { width:90%; min-width:1500px; margin:0 auto; text-align:center; }	
.about_2_6 .content_wrap h1 { display:block; margin:0 auto 50px; font-size:2.2em; font-weight:600; color:#222; }
.about_2_6 .content_wrap .pic { display:block; margin:50px 0; text-align:center;}
.about_2_6 .content_wrap .pic img { width:100%; max-width:1237px; }


/* 회사소식 유튜브 */
.about_youtube { background:#f6f6f6; padding:80px 0; margin-top: 60px; }	
.about_youtube .content_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; width:90%; min-width:1500px; margin:0 auto; }	
.about_youtube .content_wrap .content { background:#fff; width:23%; text-align:center; }


/* 인증특허납품이력 */
.popup-gallery { display:flex; justify-content:space-between; flex-wrap:wrap; margin:0; }
.popup-gallery a { width:15%; margin:0 0 3%;}
.popup-gallery a img { border:1px #e0e0e0 solid; width:99%; }
.popup-gallery a p { display:block; margin-top:10px; margin-bottom:10px; font-weight:400; line-height:22px; text-align:center; }


/* 고객지원 한국 오피스 */
.kor_office { display:flex; justify-content:space-between; flex-wrap:wrap; }
.kor_office .desc { margin:auto 0; width:45%;}
.kor_office .desc p { display:block; margin:0 0 50px; }
.kor_office .desc > span { display:flex; border-bottom:1px solid #dedede; margin:20px 0 0; padding:0 0 20px; }
.kor_office .desc img { height:60px; margin:0 20px 0 5px; }
.kor_office .desc h1 { margin:auto 0; font-family: 'GmarketSansBold'; font-size:1.3em; color:#222; }
.kor_office .desc h1 span { color:#d22730; }
.kor_office .desc h2 { margin:auto 0; font-size:1.1em; font-weight:500; color:#222; }
.kor_office .map { width:50%;}


/* 고객지원 AS접수 */
.support_as { background:#f6f6f6; padding:120px 0;}
.support_as .content_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; width:90%; min-width:1500px; margin:0 auto; }
.support_as .content_wrap .map2 { width:45%; text-align:center; }
.support_as .content_wrap .content { width:48%; }
.support_as .content_wrap .content .desc { width:100%;}
.support_as .content_wrap .content .desc span { display:flex; margin:40px 0 0; padding:0 0 20px; }
.support_as .content_wrap .content .desc img { height:60px; margin:0 20px 0 0; }
.support_as .content_wrap .content .desc h1 { margin:auto 0; font-size:1.5em; color:#222; }
.support_as .content_wrap .content .desc h1 p { display:inline-block; font-size:0.8em; }
.support_as .content_wrap .content .desc > p { display:block; margin:10px 0 15px; font-size:0.95em; }


/* 글로벌 브랜드 */
.global_brand { display:flex; justify-content:space-between; flex-wrap:wrap; height:100%;}
.global_brand .content { display:flex; flex-direction:column; border:1px solid #dedede; width:20%; padding:5%; overflow:hidden; }
.global_brand .content .pic { display:block; border-bottom:1px solid #333; margin:0 0 30px; padding:0 0 30px; text-align:center; }
.global_brand .content .pic img { width:100%; margin:0 auto; }
.global_brand .content h1 { display:block; margin:0 0 20px; font-size:1.5em; font-weight:600; color:#222; line-height:1.4em; text-align:center; }
.global_brand .content p { text-align:center; }
.global_brand .content span { margin-top:auto; }
.global_brand .content span a { display:block; background:#dedede; border-radius:10px; padding:15px 30px; margin:50px auto 0; font-size:0.9em; color:#222; text-align:center; transition:all 0.5s;}
.global_brand .content span a:hover { background:#d22730; color:#fff; transition:all 0.5s;}


/* 채용정보 및 인재상 */
.support_3_1 { display:flex; justify-content:space-between; flex-wrap:wrap; background:url(../images/support_03_01.jpg) right no-repeat #d22730; background-size:50%; }
.support_3_1 .desc { margin:auto 0; width:38%; padding:7% 6%; }
.support_3_1 .desc h1 { display:block; margin:0 0 30px; font-family: 'SpoqaHanSansNeo-Bold'; font-size:2.0em; color:#fff; }
.support_3_1 .desc ul li { list-style-image:url(../images/dot2.png); list-style-type:disc; list-style-position:outside; margin:10px 0 10px 20px; padding-left:3px; line-height:1.5em; text-align:left; color:#ffe746; }
.support_3_1 .desc p { display:block; margin:30px 0; font-size:1.0em; color:#fff; }
.support_3_1 .desc span { font-size:1.0em; color:#fff; }
.support_3_1 .pic { display:none; }


}


@media (min-width:768px) and (max-width:1499px){

	.mh_guide { padding:48px 32px; }
.mh_guide .cr_swatch { width:96px; }
/* 기능 아이콘 2열 배치 */
.mh_story .feature { width:50%; margin-bottom:28px; }
	
	/* 레지디오 소개 */	
.about_1_1 { display:flex; justify-content:space-between; flex-wrap:wrap; border:1px solid #eee; }
.about_1_1 .pic { margin:auto 0; background:#fff; width:25%; padding:5%; }
.about_1_1 .pic img { width:100%;}
.about_1_1 .desc { background:#f6f6f6; width:55%; padding:5%;}
.about_1_1 .desc strong { color:#222; }

.about_1_2 {}
.about_1_2 .pic { display:block; margin:0 0 70px; }
.about_1_2 .pic img { width:100%; }
.about_1_2 .desc { display:flex; justify-content:space-between; flex-wrap:wrap; }
.about_1_2 .desc span { width:48%; }	

/* 혁신의 역사 */
.about_1_3 { background:#f6f6f6; padding:120px 0; }	
.about_1_3 .title { text-align:center; }
.about_1_3 .title h1 { display:block; margin:0 0 15px; font-size:2.4em; font-weight:600; color:#222; line-height:1.5em; letter-spacing:0; }
.about_1_3 .title h2 { font-size:1.1em; font-weight:400; color:#222; line-height:1.5em; letter-spacing:0; }
.about_1_3 .content_wrap { width:90%; margin:0 auto; }	
.about_1_3 .content_wrap .content { display:flex; justify-content:space-between; flex-wrap:wrap; border-top:1px solid #dedede; margin:50px 0 0; padding:50px 0 0; }
.about_1_3 .content_wrap .content .pic { margin:auto 0; order:3; background:#fff; border-radius:20px; padding:2.5%; width:25%; text-align:center; }
.about_1_3 .content_wrap .content .pic img { width:80%; }
.about_1_3 .content_wrap .content .period { width:15%; margin:1.5% 0 0 0; font-family: 'GmarketSansBold'; font-size:1.6em; color:#d22730; }
.about_1_3 .content_wrap .content .desc { width:45%; padding:0 6% 0 4%; }
.about_1_3 .content_wrap .content .desc span { display:flex; margin:15px 0;}
.about_1_3 .content_wrap .content .desc span h1 { font-family: 'GmarketSansBold'; font-size:1.0em; color:#222; }
.about_1_3 .content_wrap .content .desc span ul { margin:-2px 0 0 20px; }


/* 우리의 가치 */
.about_2_1 { display:flex; justify-content:space-between; flex-wrap:wrap; background:url(../images/about_02_01_mob.jpg) right no-repeat #d22730; background-size:50%; }
.about_2_1 .desc { margin:auto 0; width:38%; padding:7% 6%; }
.about_2_1 .desc span:nth-child(1) { display:block; margin:0 0 50px; }
.about_2_1 .desc h1 { display:block; margin:0 0 20px; font-family: 'SpoqaHanSansNeo-Bold'; font-size:1.6em; color:#fff; }
.about_2_1 .desc p { font-size:1.0em; color:#fff; }
.about_2_1 .pic { display:none; }

/* Our values */
.about_2_2 { }
.about_2_2 .content_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; margin:40px 0 0; }
.about_2_2 .content_wrap .content { width:21%; text-align:center; }
.about_2_2 .content_wrap .content .pic img { height:120px; }
.about_2_2 .content_wrap .content .desc { display:block; margin:10px 0 0; }
.about_2_2 .content_wrap .content .desc h1 { display:block; margin:0 0 20px; font-size:1.1em; font-weight:600; color:#222; text-decoration:underline; }

/* HISTORY OF INNOVATION IS IN OUR DNA */
.about_2_3 { background:#f6f6f6; padding:120px 0; }	
.about_2_3 .content_wrap { width:90%; margin:0 auto; }	
.about_2_3 .content_wrap .flow { display:block; margin:80px 0; text-align:center;}
.about_2_3 .content_wrap .flow img { width:100%; }
.about_2_3 .content_wrap .diagram { background:#fff; border-radius:30px; padding:6% 5%; text-align:center; }
.about_2_3 .content_wrap .diagram img { width:100%; }

/* OUR BRANDS */
.about_2_4 { }
.about_2_4 .content_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; }
.about_2_4 .content_wrap .content { border-radius:30px 0 30px 0; border:1px solid #dedede; box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.0); margin:30px 0 0; width:38%; padding:5%; }
.about_2_4 .content_wrap .content .pic { display:block; border-bottom:1px solid #333; padding:0 0 30px 0; margin:0 0 50px; text-align:center; }
.about_2_4 .content_wrap .content .pic img { width:80%; padding:0 10%; }
.about_2_4 .content_wrap .content .desc { display:block; }
.about_2_4 .content_wrap .content .desc h1 { font-size:1.6em; font-weight:600; color:#222; }
.about_2_4 .content_wrap .content .desc span { display:block; margin:30px 0 0; }
.about_2_4 .content_wrap .content .desc span h2 { font-size:1.2em; color:#d22730; }
.about_2_4 .content_wrap .content .desc span p { display:block; margin:10px 0 0; }

/* RESIDEO – THE CONNECTED HOME */
.about_2_5 { margin:70px auto 0; width:100%; text-align:center; }
.about_2_5 img { width:80%; }

.about_2_6 { background:#f6f6f6; padding:120px 0; }	
.about_2_6 .content_wrap { width:90%; margin:0 auto; text-align:center; }	
.about_2_6 .content_wrap h1 { display:block; margin:0 auto 50px; font-size:2.2em; font-weight:600; color:#222; }
.about_2_6 .content_wrap .pic { display:block; margin:50px 0; text-align:center;}
.about_2_6 .content_wrap .pic img { width:100%; }

	
/* 회사소식 유튜브 */
.about_youtube { background:#f6f6f6; padding:60px 0; margin-top: 60px; }	
.about_youtube .content_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; width:90%; margin:0 auto; }	
.about_youtube .content_wrap .content { background:#fff; width:23%; text-align:center; }


/* 인증특허납품이력 */
.popup-gallery { display:flex; justify-content:space-between; flex-wrap:wrap; margin:0; }
.popup-gallery a { width:17%; margin:0 0 3%;}
.popup-gallery a img { border:1px #e0e0e0 solid; width:99%; }
.popup-gallery a p { display:block; margin-top:10px; margin-bottom:10px; font-weight:400; line-height:22px; text-align:center; }


/* 고객지원 한국 오피스 */
.kor_office { display:flex; justify-content:space-between; flex-wrap:wrap; }
.kor_office .desc { margin:auto 0; width:45%;}
.kor_office .desc p { display:block; margin:0 0 30px; }
.kor_office .desc > span { display:flex; border-bottom:1px solid #dedede; margin:20px 0 0; padding:0 0 20px; }
.kor_office .desc img { height:40px; margin:0 15px 0 5px; }
.kor_office .desc h1 { margin:auto 0; font-family: 'GmarketSansBold'; font-size:1.2em; color:#222; }
.kor_office .desc h1 span { color:#d22730; }
.kor_office .desc h2 { margin:auto 0; font-size:1.0em; font-weight:500; color:#222; }
.kor_office .map { width:50%;}


/* 고객지원 AS접수 */
.support_as { background:#f6f6f6; padding:90px 0;}
.support_as .content_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; width:90%; margin:0 auto; }
.support_as .content_wrap .map2 { width:45%; }
.support_as .content_wrap .content { margin:auto 0;width:48%; }
.support_as .content_wrap .content .desc { width:100%;}
.support_as .content_wrap .content .desc span { display:flex; margin:20px 0 0; padding:0 0 20px; }
.support_as .content_wrap .content .desc img { height:40px; margin:0 15px 0 5px; }
.support_as .content_wrap .content .desc h1 { margin:auto 0; font-size:1.4em; color:#222; }
.support_as .content_wrap .content .desc h1 p { display:inline-block; font-size:0.8em; }
.support_as .content_wrap .content .desc > p { display:block; margin:10px 0; font-size:0.95em; }


/* 글로벌 브랜드 */
.global_brand { display:flex; justify-content:space-between; flex-wrap:wrap; height:100%;}
.global_brand .content { display:flex; flex-direction:column; border:1px solid #dedede; width:21%; padding:5%; overflow:hidden; }
.global_brand .content .pic { display:block; border-bottom:1px solid #333; margin:0 0 30px; padding:0 0 30px; text-align:center; }
.global_brand .content .pic img { width:100%; margin:0 auto; }
.global_brand .content h1 { display:block; margin:0 0 20px; font-size:1.3em; font-weight:600; color:#222; line-height:1.4em; text-align:center; }
.global_brand .content p { text-align:center; }
.global_brand .content span { margin-top:auto; }
.global_brand .content span a { display:block; background:#dedede; border-radius:10px; padding:15px 30px; margin:50px auto 0; font-size:0.9em; color:#222; text-align:center; transition:all 0.5s;}
.global_brand .content span a:hover { background:#d22730; color:#fff; transition:all 0.5s;}


/* 채용정보 및 인재상 */
.support_3_1 { display:flex; justify-content:space-between; flex-wrap:wrap; background:url(../images/support_03_01_mob.jpg) right no-repeat #d22730; background-size:50%; }
.support_3_1 .desc { margin:auto 0; width:38%; padding:7% 6%; }
.support_3_1 .desc h1 { display:block; margin:0 0 20px; font-family: 'SpoqaHanSansNeo-Bold'; font-size:1.6em; color:#fff; }
.support_3_1 .desc ul li { list-style-image:url(../images/dot2.png); list-style-type:disc; list-style-position:outside; margin:10px 0 10px 20px; padding-left:3px; line-height:1.5em; text-align:left; color:#ffe746; }
.support_3_1 .desc p { display:block; margin:30px 0; font-size:1.0em; color:#fff; }
.support_3_1 .desc span { font-size:1.0em; color:#fff; }
.support_3_1 .pic { display:none; }


}


@media (max-width:767px){
	
	.mh_guide { padding:36px 20px; }

/* 2단 → 1단 */
.mh_guide .g_col_l, .mh_guide .g_col_r { width:100%; }

.mh_guide .lt_box img { width:70%; }

/* 색상 행 : 이름/스와치/값 세로 정렬 */
.mh_guide .color_row { flex-wrap:wrap; gap:10px 16px; }
.mh_guide .cr_name { width:auto; }
.mh_guide .cr_swatch { width:100px; height:52px; }
.mh_guide .cr_val { width:100%; }

.mh_guide .fs_sample { font-size:2em; line-height: 1.1 }
.mh_guide .fs_desc{ font-size:0.9em;  }
	
/* 헤더 */
.mh_story .mh_head { padding:40px 20px 44px; }
.mh_story .photo { width:26%; opacity:0.5; }
.mh_story .headline { font-size:1.5em; }
.mh_story .lede { font-size:0.9em; }
.mh_story .lede br { display:none; }
	.mh_story .col_tit {font-size: 1.2em;}
	.mh_story .col_txt {font-size: 0.9em;}
	.mh_story .col_txt br { display:none; }

/* 좌/우 패널 세로 정렬 (배너는 각 내용과 붙어서 이동) */
.mh_story .mh_panel { width:100%; }
.mh_story .panel_right { border-left:0; }
.mh_story .banner { min-height:0; padding:18px 24px; }
.mh_story .panel_cont { padding:32px 24px; }
	.mh_story .tl_item {padding-top: 20px;}
	.mh_story .tl_year {margin-bottom: 10px;}
	.mh_story .tl_dot { width: 12px;    height: 12px;    background: #fff;    border: 2px solid #164681;    border-radius: 50%;}

/* 타임라인 세로 정렬 */
.mh_story .timeline { display:block; padding-top:0; }
.mh_story .timeline::before { display:none; }
.mh_story .tl_item { width:100%; margin-top:24px; }

/* 기능 아이콘 2열 */
.mh_story .feature { width:50%; margin-bottom:28px; }

/* 푸터 세로 정렬 */
.mh_story .mh_foot { flex-direction:column; text-align:center; gap:60px; }
	
.mh_story .values_list { justify-content:center; }
.mh_story .quote { padding:0; border:0; }
.mh_story .brand { align-items:center; }

	
	
.divide_hor { display:flex; justify-content:space-between; flex-wrap:wrap; }
.divide_hor .pic { width:100%; margin:0 auto; }
.divide_hor .pic img { width:100%; }
.divide_hor .desc { margin:20px 0 0; width:100%; }
.divide_hor .desc h1 { display:block; margin:0 0 5px; font-size:1.3em; color:#164681; line-height:1.4em; }
.divide_hor .desc p { text-align:left; }

.divide4_pic { display:flex; justify-content:space-between; flex-wrap:wrap; height:100%; }
.divide4_pic .content { border-bottom:0px solid #dedede; width:48%; margin:2% 0; overflow:hidden; }
.divide4_pic .content img { width:100%; margin:0 auto; }

.divide4 { display:flex; justify-content:space-between; flex-wrap:wrap; height:100%; }
.divide4 .content { border-bottom:1px solid #dedede; width:47%; margin:0 0 6%; overflow:hidden;}
.divide4 .content .pic { display:block; text-align:center; }
.divide4 .content .pic img { width:100%; margin:0 auto; }
.divide4 .content .desc { display:block; border-left:1px solid #dedede; border-right:1px solid #dedede; height:90%; padding:5%;}
.divide4 .content .desc h1 { display:block; margin:0 0 10px; font-size:1.5em; font-weight:600; color:#07439f; text-align:center; }
.divide4 .content .desc p { text-align:center; }	
.divide4 .hidden { display:none; }	

.divide4_tit { display:flex; justify-content:space-between; flex-wrap:wrap; height:100%; }
.divide4_tit .content { border-bottom:1px solid #dedede; width:48.5%; margin:1.5% 0; overflow:hidden; }
.divide4_tit .content h1 { background:#69c11e; padding:10px 0; font-size:1.0em; font-weight:; color:#fff; text-align:center; }
.divide4_tit .content span { display:block; border-left:1px solid #dedede; border-right:1px solid #dedede; height:80%; padding:10%; text-align:center; }


/* 레지디오 소개 */	
.about_1_1 { display:flex; justify-content:space-between; flex-wrap:wrap; background:#f6f6f6; border:1px solid #eee; }
.about_1_1 .pic { background:#fff; width:100%; padding:15% 0; text-align:center; }
.about_1_1 .pic img { width:65%;  }
.about_1_1 .desc { width:80%; padding:10%;}
.about_1_1 .desc strong { color:#222; }

.about_1_2 {}
.about_1_2 .pic { display:block; margin:0 0 30px; }
.about_1_2 .pic img { width:100%; }
.about_1_2 .desc { display:flex; justify-content:space-between; flex-wrap:wrap; }
.about_1_2 .desc span { width:100%; }	

/* 혁신의 역사 */
.about_1_3 { background:#f6f6f6; padding:60px 0; }	
.about_1_3 .title { width:85%; margin:0 auto; text-align:center; }
.about_1_3 .title h1 { display:block; margin:0 0 15px; font-size:1.5em; font-weight:600; color:#222; line-height:1.5em; letter-spacing:0; }
.about_1_3 .title h2 { font-size:1.05em; font-weight:400; color:#222; line-height:1.5em; letter-spacing:0; }
.about_1_3 .content_wrap { width:85%; margin:0 auto; }	
.about_1_3 .content_wrap .content { border-top:1px solid #dedede; margin:30px 0 0; padding:30px 0 0; }
.about_1_3 .content_wrap .content .pic { background:#fff; border-radius:10px; padding:10%; width:80%; text-align:center; }
.about_1_3 .content_wrap .content .pic img { width:60%; }
.about_1_3 .content_wrap .content .period { margin:25px 0 15px; font-family: 'GmarketSansBold'; font-size:1.4em; color:#d22730; }
.about_1_3 .content_wrap .content .desc { }
.about_1_3 .content_wrap .content .desc span { display:flex; margin:10px 0;}
.about_1_3 .content_wrap .content .desc span h1 { font-family: 'GmarketSansBold'; font-size:0.9em; color:#222; }
.about_1_3 .content_wrap .content .desc span ul { margin:0 0 0 10px; }
	
	
/* 우리의 가치 */
.about_2_1 { display:flex; justify-content:space-between; flex-wrap:wrap; }
.about_2_1 .desc {  background:#d22730; width:80%; padding:15% 10%; }
.about_2_1 .desc span:nth-child(1) { display:block; margin:0 0 30px; }
.about_2_1 .desc h1 { display:block; margin:0 0 10px; font-family: 'SpoqaHanSansNeo-Bold'; font-size:1.4em; color:#fff; }
.about_2_1 .desc p { font-size:1.0em; color:#fff; }
.about_2_1 .pic { width:100%; }
.about_2_1 .pic img { width:100%; }	

/* Our values */
.about_2_2 { }
.about_2_2 .content_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; margin:0; }
.about_2_2 .content_wrap .content { width:46%; margin:6% 0; text-align:center; }
.about_2_2 .content_wrap .content .pic img { width:90%; }
.about_2_2 .content_wrap .content .desc { display:block; margin:10px 0 0; }
.about_2_2 .content_wrap .content .desc h1 { display:block; margin:0 0 10px; font-size:1.0em; font-weight:600; color:#222; letter-spacing:0.5px; text-decoration:underline; }

/* HISTORY OF INNOVATION IS IN OUR DNA */
.about_2_3 { background:#f6f6f6; padding:60px 0; }	
.about_2_3 .content_wrap { width:85%; margin:0 auto; }	
.about_2_3 .content_wrap .flow { display:block; margin:30px 0; text-align:center;}
.about_2_3 .content_wrap .flow img { width:100%; }
.about_2_3 .content_wrap .diagram { background:#fff; border-radius:10px; padding:6% 5%; text-align:center; }
.about_2_3 .content_wrap .diagram img { width:100%; }

/* OUR BRANDS */
.about_2_4 { }
.about_2_4 .content_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; }
.about_2_4 .content_wrap .content { border-radius:30px 0 30px 0; border:1px solid #dedede; box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.0); margin:10px 0; width:79.5%; padding:10%; }
.about_2_4 .content_wrap .content .pic { display:block; border-bottom:1px solid #333; padding:0 0 20px 0; margin:0 0 30px; text-align:center; }
.about_2_4 .content_wrap .content .pic img { width:90%; padding:0; }
.about_2_4 .content_wrap .content .desc { display:block; }
.about_2_4 .content_wrap .content .desc h1 { font-size:1.3em; font-weight:600; color:#222; }
.about_2_4 .content_wrap .content .desc span { display:block; margin:20px 0 0; }
.about_2_4 .content_wrap .content .desc span h2 { font-size:1.1em; color:#d22730; }
.about_2_4 .content_wrap .content .desc span p { display:block; margin:5px 0 0; }

/* RESIDEO – THE CONNECTED HOME */
.about_2_5 { margin:30px auto 0; width:100%; text-align:center; }
.about_2_5 img { width:100%; }

.about_2_6 { background:#f6f6f6; padding:60px 0; }	
.about_2_6 .content_wrap { width:85%; margin:0 auto; text-align:center; }	
.about_2_6 .content_wrap h1 { display:block; margin:0 auto 20px; font-size:1.6em; font-weight:600; color:#222; }
.about_2_6 .content_wrap .pic { display:block; margin:30px 0; text-align:center;}
.about_2_6 .content_wrap .pic img { width:100%; }


/* 회사소식 유튜브 */
.about_youtube { background:#f6f6f6;  padding:25px 0 50px; margin-top: 60px; }	
.about_youtube .content_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; width:85%; margin:0 auto; }	
.about_youtube .content_wrap .content { background:#fff; width:48%; margin:2% 0; text-align:center; }


/* 인증특허납품이력 */
.popup-gallery { display:flex; justify-content:space-between; flex-wrap:wrap; margin:0; }
.popup-gallery a { width:47%; margin:0 0 5% 0; }
.popup-gallery a img { border:1px #e0e0e0 solid; width:99%; }
.popup-gallery a p { display:block; margin-top:10px; margin-bottom:10px; font-weight:400; line-height:1.3em; text-align:center; }


/* 고객지원 한국 오피스 */
.kor_office { display:flex; justify-content:space-between; flex-wrap:wrap; }
.kor_office .desc { order:2; margin:auto 0; width:100%;}
.kor_office .desc p { display:block; margin:0 0 20px; }
.kor_office .desc > span { display:flex; border-bottom:1px solid #dedede; margin:12px 0 0; padding:0 0 12px; }
.kor_office .desc img { height:30px; margin:0 10px 0 5px; }
.kor_office .desc h1 { margin:auto 0; font-size:1.1em; color:#222; }
.kor_office .desc h1 span { color:#d22730; }
.kor_office .desc h2 { margin:auto 0; font-size:1.0em; font-weight:500; color:#222; }
.kor_office .map { display:block; margin:0 0 30px; width:100%;}


/* 고객지원 AS접수 */
.support_as { background:#f6f6f6; padding:50px 0;}
.support_as .content_wrap { display:flex; justify-content:space-between; flex-wrap:wrap; width:85%; margin:0 auto; }
.support_as .content_wrap .map2 { width:100%; margin:0 0 30px; }
.support_as .content_wrap .content { width:100%; }
.support_as .content_wrap .content .desc { width:100%;}
.support_as .content_wrap .content .desc span { display:flex; margin:12px 0 0; padding:0 0 12px; }
.support_as .content_wrap .content .desc img { height:30px; margin:0 10px 0 0; }
.support_as .content_wrap .content .desc h1 { margin:auto 0; font-size:1.3em; color:#222; }
.support_as .content_wrap .content .desc h1 p { display:inline-block; font-size:0.6em; }
.support_as .content_wrap .content .desc > p { display:block; margin:10px 0; }


/* 글로벌 브랜드 */
.global_brand { display:flex; justify-content:space-between; flex-wrap:wrap; height:100%;}
.global_brand .content { border:1px solid #dedede; width:60%; padding:10%; margin:5% auto; overflow:hidden; }
.global_brand .content .pic { display:block; border-bottom:1px solid #333; margin:0 0 15px; padding:0 0 15px; text-align:center; }
.global_brand .content .pic img { width:100%; margin:0 auto; }
.global_brand .content h1 { display:block; margin:0 0 20px; font-size:1.1em; font-weight:600; color:#222; line-height:1.4em; text-align:center; }
.global_brand .content p { text-align:center; }
.global_brand .content span {  }
.global_brand .content span a { display:block; background:#dedede; border-radius:10px; padding:10px 20px; margin:40px auto 0; font-size:0.8em; color:#222; text-align:center; transition:all 0.5s;}
.global_brand .content span a:hover { background:#d22730; color:#fff; transition:all 0.5s;}


/* 채용정보 및 인재상 */
.support_3_1 { display:flex; justify-content:space-between; flex-wrap:wrap; }
.support_3_1 .desc { background:#d22730; width:80%; padding:15% 10%; }
.support_3_1 .desc h1 { display:block; margin:0 0 10px; font-family: 'SpoqaHanSansNeo-Bold'; font-size:1.4em; color:#fff;; }
.support_3_1 .desc ul li { list-style-image:url(../images/dot2.png); list-style-type:disc; list-style-position:outside; margin:10px 0 10px 20px; padding-left:3px; line-height:1.5em; text-align:left; color:#ffe746; }
.support_3_1 .desc p { display:block; margin:30px 0; font-size:1.0em; color:#fff; }
.support_3_1 .desc span { font-size:1.0em; color:#fff; }
.support_3_1 .pic { width:100%; }
.support_3_1 .pic img { width:100%; }	






}


