﻿@charset "utf-8";
/* 
	*Filename : style_layout.css
	*Function : Common Layout
	*Comment  : Miral Auto Camp Corp. Layout Style sheet - Layout Style - Arabic
	*History  : 2016-02-23, 2026-08-27 Leen created.
				Mobile ver. - style_layout_vmode.css, style_layout_hmode.css
	*Author   : Copyrightⓒ Miral Auto Camp. All Rights Reserved. 
*/

body {
	height: 100%; /* body와 html의 높이를 100% 로 지정 */	
	margin: 0px;
	background: url(/img/com/bg.gif) top repeat-x;	/*basic*/
	overflow-x: hidden;  /* 가로 스크롤바 안나오게 */
}

#formARA {
    display: flex;
    flex-direction: column;
    min-height: 100vh; /* 100vh는 브라우저 화면의 100% 높이를 의미합니다 */	
	background-color: transparent; /* 추가! 폼을 투명하게 만들어 body 배경이 비치게 함 */
}

#main {
	width: 1000px; 	/*basic*/
	position: relative;
	right: 50%; /* 화면의 중앙에 위치 */
	margin-right: -500px; /* basic / 높이의 절반과 너비의 절반 만큼 margin 을 이용하여 조절해 줍니다. */
	margin-top: 0;
	border: none;
	/*background-color: #fff; /* 백그라운드 이미지에서 컬러로 수정 */	
	flex: 1; /* 빈 공간을 모두 흡수해서 풋터를 바닥으로 밀어냅니다! */
}
/* ------ Header (only Basic) ------ */

#toputil_left {
	width: 960px;
	right: 50%;
	margin-right: -480px;
	line-height: 20px;
	font-size: 12px;
	color: #cbcbcb;
	text-transform: uppercase;
	position: relative;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: start ; /* 언어에 따른 정렬 메뉴 */
}
/* ------ Header (All) ------ */

#toputil hr {
	margin: 0;
	border: 0;
	border-top: 2px solid #007bd0;
}
#toputil {
	width: 100%;
	background: #000;
}
#toputil_left a {
	color: #cbcbcb;
	text-decoration: none;
}
#toputil_left a:hover {
	color: #ffffff;
}
/* ------ Title ------ */

#title01, #title02, #title03, #title04, #title05, #title06, #title07, #title08 {
	height: 106px;
	margin: 1px 0;
	text-transform: uppercase;
	font-family: 'Tajawal', 'Cairo', 'sans-serif';
	padding-left: 28px;	
	color: #d5d5d5;
	text-align: start ; /* 언어에 따른 정렬 텍스트  */		
}
/* bg image (only basic) */
#title01 {
	background: url(/img/com/title_bg01.jpg) right no-repeat;
	background-color: #fff;
}
#title02 {
	background: url(/img/com/title_bg02.jpg) right no-repeat;
	background-color: #fff;
}
#title03 {
	background: url(/img/com/title_bg03.jpg) right no-repeat;
	background-color: #fff;
}
#title04 {
	background: url(/img/com/title_bg04.jpg) right no-repeat;
	background-color: #fff;
}
#title05 {
	background: url(/img/com/title_bg05.jpg) right no-repeat;
	background-color: #fff;
}
#title06 {
	background: url(/img/com/title_bg06.jpg) right no-repeat;
	background-color: #fff;
}
#title07 {
	background: url(/img/com/title_bg07.jpg) right no-repeat;
	background-color: #fff;
}
#title08 {
	background: url(/img/com/title_bg08.jpg) right no-repeat;
	background-color: #fff;
}
#title01 h1, #title02 h1, #title03 h1, #title04 h1, #title05 h1, #title06 h1, #title07 h1, #title08 h1 {
	color: #0067ae;
	font-size: 48px;
	float: left;
	margin-top: 40px;
	margin-bottom: 0px;
	background: url(/img/com/title_slash.png) left 10px no-repeat;
	padding-left: 35px;
	padding-bottom: 20px;
	font-weight: normal;
	text-align: start ; /* 언어에 따른 정렬 텍스트 */
}
#title01 h2, #title02 h2, #title03 h2, #title04 h2, #title05 h2, #title06 h2, #title07 h2, #title08 h2 {
	color: #000;
	font-size: 30px;
	float: left;
	margin-top: 56px;
	margin-bottom: 0px;
	margin-right: 10px;	
	font-weight: normal;
	text-align: start ; /* 언어에 따른 정렬 텍스트 */
}
/* ------ Path (only Basic) ------ */
#path {
	width: 920px;	/*basic*/
	text-align: right; 
	font-size: 9pt;
	margin : 10px 40px; /*basic*/
	float: left;
	text-transform: uppercase;
	text-align: start ; /* 언어에 따른 정렬 텍스트 */
}
#content {
	width: 920px;	/*basic*/
	margin: 10px 40px 50px 40px; /*basic*/
	line-height: 150%;
	float: left;
	text-align: start ; /* 언어에 따른 정렬 텍스트 */
}

/* ----- Top Button ----- */
#topbutton {
	width: 920px; 	/*basic*/
	position: relative;
	right: 50%; /* 화면의 중앙에 위치 */
	margin-right: 460px; /* basic / 높이의 절반과 너비의 절반 만큼 margin 을 이용하여 조절해 줍니다. */
	padding-top: 10px;
	padding-bottom: 10px;
	clear:both;
	text-align: start ; /* 언어에 따른 정렬 텍스트 */
	background-color:#fff !important;
}
#topbutton a {
	color: #777;
	font-size: 13px;
}

/* ------ Footer (only Basic) ------ */

.footer1_con {
	width: 920px;
	margin-left: -460px; /* 높이의 절반과 너비의 절반 만큼 margin 을 이용하여 조절해 줍니다. */
}
.footer1_con li {
	padding-left: 15px; /*basic*/
}
/* ------ Footer (All) ------ */

#footer1 {
	width: 100%;
	background-color: #9f9f9f;
	float: left;
	text-transform: uppercase;
	clear: both;
}
.footer1_con {
	position: relative;
	color: #ffffff;
	left: 50%; /* 화면의 중앙에 위치 */
	padding: 17px 0;
}
.footer1_con ul {
	list-style: none;
	line-height: 140%;
	margin: 0 0 15px 0;
	padding: 0;
	width: 33%;
	float: left;
}
.footer1_con li {
	background: url(/img/com/blt01.gif) no-repeat top left;
	text-transform: uppercase;
	margin: 2px 0;
}
.footer1_con a {
	display: block;
	text-decoration: none;
	font-weight: normal;
	color: #444444;
}
.footer1_con a:hover {
	color: #ffffff;
}
#footer2 {
	width: 100%;
	background-color: #000000;
	color: #cbcbcb;
	text-align: center;
	text-transform: uppercase;
	clear: both;
	font-size: 12px;
	padding: 17px 0;
	line-height: 180%;
}
#footer2 a {
	color: #cbcbcb;
	text-decoration: none;
}
#footer2 a:hover {
	color: #ffffff;
}

#footer3 {
	width: 100%;
	background-color: #004f91;
	color: #ffffff;
	text-align: center;
	text-transform: uppercase;
	clear: both;
	font-size: 12px;
	padding:13px 0 7px 0;
	line-height: 180%;
}
#footer3 a {
		color:			#ffffff;
		text-decoration:none;
}
#footer3 a:hover {		
		text-decoration:underline;
}

/* -------------------------basic style_layout.css : all and (min-width:1001px) ---------------------------------*/

