@charset "utf-8";
/* 
	*Filename : style_layout_vmode.css
	*Function : Vmode Layout (max-width:567px)
	*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;
	overflow-x: hidden;  /* 가로 스크롤바 안나오게 */
}

#formARA {
    display: flex;
    flex-direction: column;
    min-height: 100vh; /* 100vh는 브라우저 화면의 100% 높이를 의미합니다 */
}

#main {
	width: 100%;  /*hmode, vmode*/
	position: relative;
	right: 50%; /* 화면의 중앙에 위치 */
	margin-right: -50%; /*hmode, vmode /높이의 절반과 너비의 절반 만큼 margin 을 이용하여 조절해 줍니다. */
	margin-top: 0;
	border: none;	
	flex: 1; /* 빈 공간을 모두 흡수해서 풋터를 바닥으로 밀어냅니다! */
}
/* ------ Header (only vmode) ------ */

#toputil_left {
	width: auto;
	line-height: 20px;
	font-size: 11px;
	color: #cbcbcb;
	text-transform: uppercase;
	position: relative;
	padding: 5px 0;
	margin-left: 10px;
}
/* ------ 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: auto;	/*vmode*/
	margin: 0;	/*hmode, vmode*/
	text-transform: uppercase;
	font-family: 'Tajawal', 'Cairo', 'sans-serif';
	padding-left: 1%;	/*hmode, vmode*/
	color: #d5d5d5;
	float: left;	/*hmode, vmode*/
	width: 99%;	/*hmode, vmode*/
	border-bottom: 1px solid #dcdcdc;	/*hmode, vmode*/
	border-top: 1px solid #dcdcdc;	/*hmode, vmode / 새로 추가 */
	background-color: #efefef;	/*hmode, vmode*/
}
#title01 h1, #title02 h1, #title03 h1, #title04 h1, #title05 h1, #title06 h1, #title07 h1, #title08 h1 {
	color: #0067ae;
	font-size: 30px;	/*vmode*/
	float: left;
	margin-top: 20px;	/*hmode, vmode*/
	margin-bottom: 0;
	background: url(/img/com/title_slash.png) left no-repeat;
	padding-left: 35px;
	font-weight: normal;
}
#title01 h2, #title02 h2, #title03 h2, #title04 h2, #title05 h2, #title06 h2, #title07 h2, #title08 h2 {
	color: #000;
	font-size: 20px;	/*vmode*/
	float: left;
	font-weight: normal;
	margin-bottom: 10px;
	margin-top: 28px;
	vertical-align: bottom;
}
/* ------ Path (only hmode, vmode) ------ */
#path {
	font-size: 9pt;
	margin: 10px 0;
	float: left;
	text-align: start ; /* 언어에 따른 정렬 텍스트 */
	width: 95%;	
	text-transform: uppercase;
	margin-left:10px;
}
#content {
	width: auto;	/*hmode, vmode*/
	margin: 10px 10px 30px 10px;	/*hmode, vmode*/
	padding-right:20px;
	padding-left:20px;
	line-height: 150%;
	float: left;
}

/* ----- Top Button ----- */
#topbutton {
	width: 100%; 	/*hmode, vmode*/
	position: relative;
	right: 50%; /* 화면의 중앙에 위치 */
	margin-right: 35%; /*hmode, vmode / 높이의 절반과 너비의 절반 만큼 margin 을 이용하여 조절해 줍니다. */
	padding-top: 10px;
	padding-bottom: 10px;
	padding-right: 10px; /*hmode, vmode*/
	clear:both;
	text-align: start ; /* 언어에 따른 정렬 텍스트 */
	background-color:#fff !important;
}
#topbutton a {
	color: #777;
	font-size: 13px;
}

/* ------ Footer (only vmode) ------ */

.footer1_con {
	width: 100%;
	margin-left: -50%; /* 높이의 절반과 너비의 절반 만큼 margin 을 이용하여 조절해 줍니다. */
}
.footer1_con li {
	padding: 2px 0 0 12px; /*hmode, vmode*/
	font-size: 11px; /*vmode*/
}
#footer2 {
	line-height: 140%;  /*hmode, vmode*/
}
/* ------ 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 1%; /*hmode, vmode*/
	padding: 0;
	width: 32%; /*hmode, vmode*/
	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: 11px;
	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: 11px;
	padding:13px 0 7px 0;
	line-height: 180%;
}
#footer3 a {
		color:			#ffffff;
		text-decoration:none;
}
#footer3 a:hover {		
		text-decoration:underline;
}

/* -------------------------vmode style.css : all and (max-width:567px) ---------------------------------*/

.tabmenu a {
	padding: 10px 5px !important;
}
.category, .top_desc {
	font-size: 100%;
}
.list_table, .list_table2, .red {
	font-size: 13px;
	font-weight: normal;
}
.tit_b_black, .company_es_date, .company_es {
	font-size: 18px;
}
dl.feature dd {
	margin: 10px 0;	/*vmode*/
	float: left;	/*vmode*/
}
.con_660, .con_password {
	width: 98% !important;
	left: 0 !important;
	margin-left: 0 !important;
	padding: 10px 0;
}
.con_password_btn {
	float: right;
	height: auto;
	width: auto;
	border-left: none;
}
/* My page */
.con_mypage01 {
	width: 98%;
}
.con_mypage02 {
	float: left;
	margin-top: 10px;
	width: 98%;
}
/* Cooperation */
#content_coop {
	width: 100%;
	margin: 20px 0 30px 0;
	background: none;
}
#content_coop ul {
	margin: 0;
	padding: 10px;
}

#content_terms {
	width: auto;
	margin: 10px 10px 30px 10px;	/*hmode, vmode*/
	line-height: 150%;
	float: left;
	background: none;
}
#content_person {
	width: 100%;	/*basic*/
	margin: 40px 0 50px 0;
	height: 565px;
	background: url(/img/contact/02_bg_v.gif) left no-repeat;
}
.person01 {
	margin-left: 10px
}
.person02 {
	margin-left: 10px;
	margin-top: 22px
}
/* Search */
.con_box_search {
	width: 97%;
}
.con_box_search_ul01 {
	margin: 10px;
	padding: 0;
}
.con_box_search_ul02 {
	margin: 10px;
	padding: 0;
}
.con_box_search_ul03 {
	float: right;
	border-left: none;
	padding: 0;
	height: auto;
}
/* Sitemap */
.sitemap {
	width: 100%;
	left: 0;
	margin-left: 0;
}
.sitemap ul {
	margin: 10px;
}
/* Privacy Policy */
.policy {
	width: 100%;
	left: 0;
	margin-left: 0;
}
.policy ol {
	margin: 10px;
}
.policy ul {
	margin: 10px;
}
/* Sign in */
.con_signin01 {
	width: 97%;
	left: 0;
	margin-left: 0;
	margin-bottom: 30px;
	padding: 0;
}
.con_signin01 ul {
	float: left;
	clear: both;
	margin: 10px;
	padding: 0;
}
.con_signin01 li {
	list-style: none;
	font-size: 24px;
	padding: 5px 0;
}
.con_signin01_btn {
	float: right;
	height: auto;
	border-left: none;
	margin-top: 10px;
	margin-bottom: 10px;
	text-align: center;
	padding: 0;
}
.con_signin01_add {
	padding: 0;
	margin: 0 0 0 10px;
	float: left;
}
.btn_join {
	float: left;
	margin-left: 10px;
}
.con_signin02 {
	width: 97%;
	left: 0;
	margin: 30px 0 80px 0;
	padding: 0;
}
.con_signin02_btn {
	float: right;
	height: 50px;
	border-left: none;
	margin-top: 10px;
	text-align: center;
	padding: 0;
}
.con_660_con {
	background: none;
	padding-left: 10px;
	padding-bottom: 15px;
	height: auto;
	float: left;
	clear: both;
	width: auto;
	margin: 10px;
}
.con_password ul {
	float: left;
	clear: both;
	margin: 10px; /* */
}
.con_password li {
	list-style: none;
	font-size: 24px;
	padding: 5px 0;
}

/* Smart ----------- */

@media (min-width:380px) and (max-width:567px) {
dl.feature {
	width: 378px !important;
	margin-left: auto !important;
	margin-right: auto !important;
} /* width를 이미지 크기와 동일하게 하고 가운데 위치 */
}
 @media (max-width:320px) {
.con_mypage01 {
	background: none;
}
.con_mypage02 {
	background: none;
}
.con_mypage01 ul, .con_mypage02 ul {
	margin: 10px;
	padding: 10px
}
}
 @media (max-width:375px) {
.btn1 {
	display: inline-block !important;
}
}