/* 이 파일은 서브메뉴들의 상단 이미지와 텍스트, 그리고 아래에 있는 회색바 메뉴 css파일입니다. */


<meta charset="utf-8">

/* 서브 상단 이미지 --------------------------------------------------------- */

#sub_main {margin:0;}

/* 서브 상단 배경 이미지 */
#sub_main .sub_back_img_01 /*(회사소개) */ { height: 350px; background-image: url('../img/sub_main01.jpg'); display: flex; flex-direction: column; justify-content: center; align-items: center; background-size: cover; } 
#sub_main .sub_back_img_02 /*(사업소개) */ { height: 350px; background-image: url('../img/sub_main02.jpg'); display: flex; flex-direction: column; justify-content: center; align-items: center; background-size: cover; } 
#sub_main .sub_back_img_03 /*(제품소개) */ { height: 350px; background-image: url('../img/sub_main03.jpg'); display: flex; flex-direction: column; justify-content: center; align-items: center; background-size: cover; } 
#sub_main .sub_back_img_04 /*(고객센터) */ { height:350px; background-image: url('../img/sub_main04.jpg'); display: flex; flex-direction: column; justify-content: center; align-items: center; background-size: cover; } 
#sub_main .sub_back_img_05 /*(온라인문의) */ { height: 350px; background-image: url('../img/sub_main05.jpg'); display: flex; flex-direction: column; justify-content: center; align-items: center; background-size: cover; } 
#sub_main .sub_back_img_06 /*(온라인문의) */ { height: 350px; background-image: url('../img/sub_main06.jpg'); display: flex; flex-direction: column; justify-content: center; align-items: center; background-size: cover; } 


/* 서브 상단 배경 이미지 텍스트 */
#sub_main .sub_main_text { color: white; font-size: 50px; font-weight: 600; text-align: center; position: relative; padding-top:100px;} /* 큰 텍스트 */
#sub_main .sub_main_text::after { content: ""; position: absolute; bottom: 0px; left: 0; width: 100%; height: 1px;  background-color: white; } /* 큰 텍스트 아래 흰색 바 */
#sub_main .sub_main_text_small {color: white; font-size: 16px; font-weight: 600; text-align: center; position: relative; padding: 20px 0 40px 0; } /* 작은 텍스트 */

@media (max-width: 640px){
#sub_main .sub_back_img_01 { height: 300px; }
#sub_main .sub_back_img_02 { height: 300px; }
#sub_main .sub_back_img_03 { height: 300px; }
#sub_main .sub_back_img_04 { height: 300px; }
#sub_main .sub_back_img_05 { height: 300px; }
#sub_main .sub_back_img_06 { height: 300px; }
#sub_main .sub_main_text { font-size: 40px; padding-top:50px; }
#sub_main .sub_main_text_small {font-size: 14px; }
} 


/* 서브 상단 이미지 끝 */





/* 서브 상단 이미지 아래 회색 메뉴바 --------------------------------------------------------- */

.sub_location_back {background-color: #ffffff;width: 100%; height: 52px; border-top: 1px solid #e2e2e2; border-bottom: 1px solid #e2e2e2; display: flex; justify-content: center; }
.sub_location { width: 1400px; display: flex; }

.item { font-size: 15px; font-weight: 500; position: relative; width: 220px; padding: 13px 16px 8px 16px; }
.item .icon { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); }
.item a { text-decoration: none; color: inherit; display: block; width: 100%; height: 100%; }   
.item:first-child { width: 55px; color: #fff; right: 0; background-color: #297df9; } /* 회색 메뉴바의 home이미지 */
.item:nth-child(2) { color: #3d3d3d; }
.item::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; width: 1px; background-color: #e2e2e2; }
		
.dropdown_menu { display: none; position: absolute; background-color: #fff; min-width: 221px; left: -1px; top: 51px; z-index: 1; opacity: 0; transition: opacity 1s ease, transform 1s ease; transform: translateY(-10px); }
.dropdown_menu.show { display: block; opacity: 1; transform: translateY(0); }
.dropdown_menu a { color: #4d4d4d; font-size : 0.9em; padding: 10px 18px; text-decoration: none; display: block; border-top: 0; border-right: 1px solid #e2e2e2; border-bottom: 1px solid #e2e2e2; border-left: 1px solid #e2e2e2; }
.dropdown_menu a:hover { background-color: #e2e2e2; }


@media (max-width: 980px){
	.item:first-child { display: none; }
	.item { width: 50%; }
	.dropdown_menu { min-width: 100%; }
}
@media (max-width: 640px){
	.item:first-child { display: none; }
} 

/* 서브 상단 이미지아래 회색 메뉴바 끝*/