@charset "UTF-8";
/*@import url('NotoSansKR.css');*/

:root {
	--color-primary: #222222;
	--color-secondary: #747474;
	--color-accent: #00a040;
	--color-accent-dark: #288546;
	--color-text: #222222;
	--color-menu: #222222;
	--color-menu2: rgba(0,0,0,0.6);
	--color-muted: #666;
	--color-bg-gray: #f0f0f0;
	--color-bg: #fff;
	--color-bg-dark: #777;
	--spacing-xxs: 4px;
	--spacing-xs: 8px;
	--spacing-sm: 12px;
	--spacing-md: 16px;
	--spacing-lg: 24px;
	--spacing-xl: 32px;
	--spacing-2xl: 48px;
	--radius-sm: 4px;
	--radius-md: 8px;
	--radius-lg: 12px;
	--shadow-sm: 0 2px 6px rgba(0,0,0,0.12);
	--shadow-md: 0 6px 20px rgba(0,0,0,0.18);
	--header-height: 100px;
	--header-height-md: 60px;

}

#codeigniter_profiler { display:none; }



/* CSS Document */
* { margin:0; padding:0; word-break:keep-all; }
/* a > * { line-height:0; } */
.row {margin-right:0; margin-left:0; }
img { border:medium none; }
html { font-size:14px; line-height:1; scroll-behavior: smooth;}
body {font-family:'Pretendard', 'Pretendard Variable', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Noto Sans KR', 'Apple SD Gothic Neo', 'Malgun Gothic', Arial, sans-serif; font-weight:400; letter-spacing:-0.2pt; }

a { color:#000; text-decoration:none; -webkit-transition:all 0.2s ease-in-out 0s; -o-transition:all 0.2s ease-in-out 0s; -moz-transition:all 0.2s ease-in-out 0s; transition:all 0.2s ease-in-out 0s; }
a:hover { color:#000; text-decoration:none; -webkit-transition:all 0.2s ease-in-out 0s; -o-transition:all 0.2s ease-in-out 0s; -moz-transition:all 0.2s ease-in-out 0s; transition:all 0.2s ease-in-out 0s; }
a:focus { outline:none; }
a:focus, a:active { text-decoration:none; }
p, ol, ul { padding:0; margin:0; }
.clear:after { content:""; display:block; clear:both; }
label { font-weight:normal; }

h1, h2, h3, h4, h5, h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 { margin:0; }
li{list-style:none; }

.clearfix {clear:both; }
.clear:after { content:""; display:block; clear:both; }
.bold {font-weight:bold; }

.pd10 { padding:10px; }
.pd15 { padding:15px; }
.pd20 { padding:20px; }
.pd30 { padding:30px; }
.pd40 { padding:40px; }
.pd50 { padding:50px; }
.pd100 { padding:100px; }

.pb10 { padding-bottom:10px; }
.pb20 { padding-bottom:20px; }
.pb30 { padding-bottom:30px; }
.pb40 { padding-bottom:40px; }
.pb50 { padding-bottom:50px; }
.pb100 { padding-bottom:100px; }

.pt10 { padding-top:10px; }
.pt20 { padding-top:20px; }
.pt30 { padding-top:30px; }
.pt40 { padding-top:40px; }
.pt50 { padding-top:50px; }
.pt100 { padding-top:100px; }

.pr10 { padding-right:10px; }
.pr20 { padding-right:20px; }
.pr30 { padding-right:30px; }
.pr40 { padding-right:40px; }
.pr50 { padding-right:50px; }
.pr100 { padding-right:100px; }

.pl10 { padding-left:10px; }
.pl20 { padding-left:20px; }
.pl30 { padding-left:30px; }
.pl40 { padding-left:40px; }
.pl50 { padding-left:50px; }
.pl100 { padding-left:100px; }

.mg10 { margin:10px; }
.mg15 { margin:15px; }
.mg20 { margin:20px; }
.mg30 { margin:30px; }
.mg40 { margin:40px; }
.mg50 { margin:50px; }
.mg100 { margin:100px; }

.mb10 { margin-bottom:10px; }
.mb20 { margin-bottom:20px; }
.mb30 { margin-bottom:30px; }
.mb40 { margin-bottom:40px; }
.mb50 { margin-bottom:50px; }
.mb100 { margin-bottom:100px; }

.mt10 { margin-top:10px; }
.mt20 { margin-top:20px; }
.mt30 { margin-top:30px; }
.mt40 { margin-top:40px; }
.mt50 { margin-top:50px; }
.mt100 { margin-top:100px; }

.mr10 { margin-right:10px; }
.mr20 { margin-right:20px; }
.mr30 { margin-right:30px; }
.mr40 { margin-right:40px; }
.mr50 { margin-right:50px; }
.mr100 { margin-right:100px; }

.ml10 { margin-left:10px; }
.ml20 { margin-left:20px; }
.ml30 { margin-left:30px; }
.ml40 { margin-left:40px; }
.ml50 { margin-left:50px; }
.ml100 { margin-left:100px; }

.per5 { width:5%; }
.per10 { width:10%; }
.per15 { width:15%; }
.per20 { width:20%; }
.per25 { width:25%; }
.per30 { width:30%; }
.per35 { width:35%; }
.per40 { width:40%; }
.per45 { width:45%; }
.per50 { width:50%}
.per55 { width:55%; }
.per60 { width:60%}
.per65 { width:65%; }
.per70 { width:70%}
.per75 { width:75%; }
.per80 { width:80%}
.per85 { width:85%; }
.per90 { width:90%}
.per95 { width:95%; }
.per100 { width:100%; }

.px10 { width:10px; }
.px20 { width:20px; }
.px30 { width:30px; }
.px40 { width:40px; }
.px50 { width:50px; }
.px60 { width:60px; }
.px70 { width:70px; }
.px80 { width:80px; }
.px90  { width:90px; }
.px100 { width:100px; }
.px150 { width:150px; }
.px200 { width:200px; }
.px250 { width:250px; }
.px300 { width:300px; }
.px350 { width:350px; }
.px400 { width:400px; }
.px450 { width:450px; }
.px500 { width:500px; }
.px550 { width:550px; }
.px600 { width:600px; }
.px650 { width:650px; }
.px700 { width:700px; }

.btn-default { color:#666; background-color:#f9f9f9; border:1px #ddd solid !important; background-image:none; text-shadow:none; }
.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default { color:#666; background-color:#f5f5f5 !important; border-color:#ccc !important; }
.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active { background-color:#333; border-color:#333; color:#fff; }
.btn-default .badge { color:#333; background-color:#fff; }


.btn-primary { color:#fff; background-color:#222; border-color:#222; background-image:none; }
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary { color:#fff; background-color:#000 !important; border-color:#000 !important; }
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active { background-color:#608068; border-color:#608068; }
.btn-primary .badge { color:#608068; background-color:#fff; }

.btn-danger { color:#fff; background-color:#ff5c57; border-color:#ff5c57; background-image:none; }
.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger.active,
.open .dropdown-toggle.btn-danger { color:#fff; background-color:#ce4741 !important; border-color:#ce4741 !important; }
.btn-danger.disabled,
.btn-danger[disabled],
fieldset[disabled] .btn-danger,
.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled:active,
.btn-danger[disabled]:active,
fieldset[disabled] .btn-danger:active,
.btn-danger.disabled.active,
.btn-danger[disabled].active,
fieldset[disabled] .btn-danger.active { background-color:#ff5c57; border-color:#ff5c57; }
.btn-danger .badge { color:#ff5c57; background-color:#fff; }

.btn-turquoise { color:#fff; background-color:#00acac; border-color:#00acac; background-image:none; }
.btn-turquoise:hover,
.btn-turquoise:focus,
.btn-turquoise:active,
.btn-turquoise.active,
.open .dropdown-toggle.btn-turquoise { color:#fff; background-color:#008a8c !important; border-color:#008a8c !important; }
.btn-turquoise.disabled,
.btn-turquoise[disabled],
fieldset[disabled] .btn-turquoise,
.btn-turquoise.disabled:hover,
.btn-turquoise[disabled]:hover,
fieldset[disabled] .btn-turquoise:hover,
.btn-turquoise.disabled:focus,
.btn-turquoise[disabled]:focus,
fieldset[disabled] .btn-turquoise:focus,
.btn-turquoise.disabled:active,
.btn-turquoise[disabled]:active,
fieldset[disabled] .btn-turquoise:active,
.btn-turquoise.disabled.active,
.btn-turquoise[disabled].active,
fieldset[disabled] .btn-turquoise.active { background-color:#00acac; border-color:#00acac; }
.btn-turquoise .badge { color:#00acac; background-color:#fff; }

.btn-royalblue { color:#fff; background-color:#717bb6; border-color:#717bb6; background-image:none; }
.btn-royalblue:hover,
.btn-royalblue:focus,
.btn-royalblue:active,
.btn-royalblue.active,
.open .dropdown-toggle.btn-royalblue { color:#fff; background-color:#464a6f !important; border-color:#464a6f !important; }
.btn-royalblue.disabled,
.btn-royalblue[disabled],
fieldset[disabled] .btn-royalblue,
.btn-royalblue.disabled:hover,
.btn-royalblue[disabled]:hover,
fieldset[disabled] .btn-royalblue:hover,
.btn-royalblue.disabled:focus,
.btn-royalblue[disabled]:focus,
fieldset[disabled] .btn-royalblue:focus,
.btn-royalblue.disabled:active,
.btn-royalblue[disabled]:active,
fieldset[disabled] .btn-royalblue:active,
.btn-royalblue.disabled.active,
.btn-royalblue[disabled].active,
fieldset[disabled] .btn-royalblue.active { background-color:#717bb6; border-color:#717bb6; }
.btn-royalblue .badge { color:#717bb6; background-color:#fff; }

.btn-warning { color:#fff; background-color:#f49b1b; border-color:#f49b1b; background-image:none; }
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.active,
.open .dropdown-toggle.btn-warning { color:#fff; background-color:#c57e00 !important; border-color:#c57e00 !important; }
.btn-warning.disabled,
.btn-warning[disabled],
fieldset[disabled] .btn-warning,
.btn-warning.disabled:hover,
.btn-warning[disabled]:hover,
fieldset[disabled] .btn-warning:hover,
.btn-warning.disabled:focus,
.btn-warning[disabled]:focus,
fieldset[disabled] .btn-warning:focus,
.btn-warning.disabled:active,
.btn-warning[disabled]:active,
fieldset[disabled] .btn-warning:active,
.btn-warning.disabled.active,
.btn-warning[disabled].active,
fieldset[disabled] .btn-warning.active { background-color:#f49b1b; border-color:#f49b1b; }
.btn-warning .badge { color:#f49b1b; background-color:#fff; }

.btn-info { color:#fff; background-color:#ad987e; border-color:#ad987e; background-image:none; }
.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active,
.open .dropdown-toggle.btn-info { color:#fff; background-color:#947a59 !important; border-color:#3492ac !important; }
.btn-info.disabled,
.btn-info[disabled],
fieldset[disabled] .btn-info,
.btn-info.disabled:hover,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus,
.btn-info[disabled]:focus,
fieldset[disabled] .btn-info:focus,
.btn-info.disabled:active,
.btn-info[disabled]:active,
fieldset[disabled] .btn-info:active,
.btn-info.disabled.active,
.btn-info[disabled].active,
fieldset[disabled] .btn-info.active { background-color:#947a59; border-color:#947a59; }
.btn-info .badge { color:#947a59; background-color:#fff; }

.btn-success { color:#fff; background-color:#333 !important; border-color:#333 !important;  background-image:none; }
.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active,
.open .dropdown-toggle.btn-success { color:#fff; background-color:#000 !important; border-color:#000 !important;}
.btn-success.disabled,
.btn-success[disabled],
fieldset[disabled] .btn-success,
.btn-success.disabled:hover,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success:hover,
.btn-success.disabled:focus,
.btn-success[disabled]:focus,
fieldset[disabled] .btn-success:focus,
.btn-success.disabled:active,
.btn-success[disabled]:active,
fieldset[disabled] .btn-success:active,
.btn-success.disabled.active,
.btn-success[disabled].active,
fieldset[disabled] .btn-success.active { background-color:#6f1a1c !important; border-color:#6f1a1c; }
.btn-success .badge { color:#6f1a1c; background-color:#fff; }


.btn-silver { color:#fff; background-color:#b7c2c8; border-color:#b7c2c8; background-image:none; }
.btn-silver:hover,
.btn-silver:focus,
.btn-silver:active,
.btn-silver.active,
.open .dropdown-toggle.btn-silver { color:#fff; background-color:#929ba2 !important; border-color:#929ba2 !important; }
.btn-silver.disabled,
.btn-silver[disabled],
fieldset[disabled] .btn-silver,
.btn-silver.disabled:hover,
.btn-silver[disabled]:hover,
fieldset[disabled] .btn-silver:hover,
.btn-silver.disabled:focus,
.btn-silver[disabled]:focus,
fieldset[disabled] .btn-silver:focus,
.btn-silver.disabled:active,
.btn-silver[disabled]:active,
fieldset[disabled] .btn-silver:active,
.btn-silver.disabled.active,
.btn-silver[disabled].active,
fieldset[disabled] .btn-silver.active { background-color:#b7c2c8; border-color:#b7c2c8; }
.btn-silver .badge { color:#b7c2c8; background-color:#fff; }

.btn-black { color:#fff; background-color:#2c353c; border-color:#2c353c; background-image:none; }
.btn-black:hover,
.btn-black:focus,
.btn-black:active,
.btn-black.active,
.open .dropdown-toggle.btn-black { color:#fff; background-color:#000 !important; border-color:#000 !important; }
.btn-black.disabled,
.btn-black[disabled],
fieldset[disabled] .btn-black,
.btn-black.disabled:hover,
.btn-black[disabled]:hover,
fieldset[disabled] .btn-black:hover,
.btn-black.disabled:focus,
.btn-black[disabled]:focus,
fieldset[disabled] .btn-black:focus,
.btn-black.disabled:active,
.btn-black[disabled]:active,
fieldset[disabled] .btn-black:active,
.btn-black.disabled.active,
.btn-black[disabled].active,black
fieldset[disabled] .btn-black.active { background-color:#2c353c; border-color:#2c353c; }
.btn-black .badge { color:#2c353c; background-color:#fff; }



/*** 헤더 영역 구조 **********************************************

navbar navbar-default
	navbar-header :
	navbar_menu
		navbar_menu_inner
			container
				row
					navbar-brand
					collapse.navbar-collapse
						nav navbar-nav navbar-right
							li.dropdown
								a : 1차메뉴
								ul.drowdown-menu
									li 
										a: 2차메뉴

					language_select

***************************************************************/
.navbar-header  {
        float: none;
}

.navbar { 
	background:transparent; 
	border:0 none; 
	border-radius:0; 
	box-shadow:none; 
	position: absolute; 
	top: 0; 
	width: 100%; 
	z-index: 99999; 
}


/* 헤더  로고 */
.navbar-default .navbar-brand { 
	background:url(../images/Logo.png) no-repeat center;
	padding:0; font-size:0; 
	display:inline-block; 
	outline:0;  
	height: var(--header-height); 
	width: 80px; /* responsive width without media queries */
	flex: 0 0 80px;
	max-width: 80px;
	background-size: contain;
}

/* 헤더 언어 이동 버튼 영역 */

.navbar_menu .navbar_menu_inner .container .row .language_select { 
	margin-left: auto; 
	flex: 0 0 auto; 
	/* min-width: clamp(40px, 6vw, 140px); */ /* responsive min-width without media queries */
}
.navbar_menu .navbar_menu_inner .language_select  a {
	font-size: 14px; 
	color: var(--color-primary);
	border-radius: 16px;
	border: 1px solid var(--color-primary);
	padding: 5px 25px;
	white-space: nowrap;
	}
.navbar_menu:hover .navbar_menu_inner .language_select a,
.navbar_menu .navbar_menu_inner .language_select a:hover {
	border-color: var(--color-primary);
	color: var(--color-primary);
	-webkit-transition:all 0.2s ease-in-out 0s; -o-transition:all 0.2s ease-in-out 0s; -moz-transition:all 0.2s ease-in-out 0s; transition:all 0.2s ease-in-out 0s; 
}


/* 1차메뉴 */
.navbar_menu .navbar-nav { /* 가로사이즈 */
	width: 100%;
}
.navbar_menu .navbar-nav>li>a { 
	color:var(--color-primary);
	font-size: clamp(16px, 1.6vw, 20px); 
	text-align: left; 
	text-transform:uppercase; 
	padding:0; 
	width:100%; 
	line-height: var(--header-height); 
	font-weight:600; 

}
.navbar_menu .navbar-nav>li>a:hover,
.navbar_menu .navbar-nav>li.dropdown:hover>a { 
	color: var(--color-accent); 
	position :relative;
}
.navbar_menu .navbar-nav>li>a:hover::before,
.navbar_menu .navbar-nav>li.dropdown:hover>a::before,
.navbar_menu .navbar-nav>li>a:hover::after,
.navbar_menu .navbar-nav>li.dropdown:hover>a::after {
	content: '';
	position: absolute;
	top: 38px; 
	width: 6px;
	height: 25px;
	border-radius: 0;
	background-color: var(--color-accent);
}
.navbar_menu .navbar-nav>li>a:hover::before,
.navbar_menu .navbar-nav>li.dropdown:hover>a::before {
	left: -10px;
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}
.navbar_menu .navbar-nav>li>a:hover::after,
.navbar_menu .navbar-nav>li.dropdown:hover>a::after {
	right: -10px;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
}


.navbar_menu .navbar-nav>li:last-of-type>a { padding-right: 0;}
.navbar_menu .navbar-nav>li:last-of-type .dropdown-menu { margin-left: 20px;}
.navbar_menu .navbar-nav>.active>a,
.navbar_menu .navbar-nav>.active>a:hover,
.navbar_menu .navbar-nav>.active>a:focus { 
	color: var(--color-accent); box-shadow:none; background-image:none; 
}
.navbar_menu .navbar-nav>.open>a,
.navbar_menu .navbar-nav>.open>a:hover,
.navbar_menu .navbar-nav>.open>a:focus {
	color: var(--color-accent); background:none; box-shadow:none; 
}

.navbar_menu .container,
.navbar .dropdown { float: inherit; }
.navbar .dropdown-menu { width: 100%; padding: 2px 0; margin:0; border:none; box-shadow:none; border-radius: 0 !important; background-color: transparent; }


/* 2026-01-20 수정: 메뉴에 마우스 올리면 배경색 흰색으로 변경 및 2차메뉴 노출 */
.navbar_menu:hover { 
	background-color: #fff; 
	height: 300px;
	box-shadow:  var(--shadow-sm);
}
.navbar_menu:hover .navbar-nav>li>a { 
	color: #222;
}
.navbar_menu .navbar_menu_inner .container {
	width: 100%; 
	padding:0 55px; 
}
.navbar_menu .navbar_menu_inner .container .row { 
	width: 100%; 
	display: flex; 
	align-items: center; 
}
.navbar_menu .navbar_menu_inner .container .row .navbar-nav { 
	display: flex; align-items: center; justify-content: space-between; 
}
/* .navbar_menu .navbar_menu_inner .container .row .navbar-nav li:first-child {
	margin-right:auto;
}
.navbar_menu .navbar_menu_inner .container .row .navbar-nav li:last-child {
	margin-left:auto;
} */

.navbar_menu .navbar_menu_inner .container .row>.navbar-collapse { 
	flex: 1 1 auto; 
	display: flex !important; 
	justify-content: center; 
}


/* 상단 2차메뉴 */
.navbar .dropdown-menu li a { 
	font-size:16px;
	line-height: 1.2; 
	color: var(--color-menu2); 
	padding: 5px 0; text-align: center;
	-webkit-transition:all 0.2s ease-in-out 0s; -o-transition:all 0.2s ease-in-out 0s; -moz-transition:all 0.2s ease-in-out 0s; transition:all 0.2s ease-in-out 0s; 
	text-align: left; text-underline-offset: 4px; text-decoration-thickness: 2px; 
	white-space: wrap;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus { 
	background:none !important; color: var(--color-accent); text-decoration: underline; 
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a { 
	-webkit-transition:all 0.2s ease-in-out 0s; -o-transition:all 0.2s ease-in-out 0s; -moz-transition:all 0.2s ease-in-out 0s; transition:all 0.2s ease-in-out 0s; 
}

/* 2026-01-20 수정: 메뉴에 마우스 올리면 모든 2차 메뉴를 한번에 노출 */
.navbar_menu:hover .navbar-nav>li.dropdown>.dropdown-menu { display:block;  }
/* .navbar_menu:hover .navbar-nav>li.dropdown>.dropdown-menu-bg { display:block; } */


/*2차메뉴 배경 */
.navbar-default .navbar-nav>.open> .dropdown-menu-bg .box { width:1320px; height:60px; margin:0 auto; /* background-color:rgba(49,50,127,1); */ box-shadow:none; }



/*** 메인페이지의 메뉴 폰트  색상 흰색 처리 ****/
.navbar-default .navbar-brand.main {
	background:url(../images/LogoWhite.png) no-repeat center !important;
}
.navbar_menu.main  .navbar-nav>li>a { color:#fff; }

.navbar_menu.main .navbar_menu_inner .language_select  a {
	color: #fff;
	border: 1px solid #fff;
}
.navbar_menu.main:hover .navbar_menu_inner .language_select  a {
	color: var(--color-primary);
	border: 1px solid var(--color-primary);
}
.navbar_menu.main .navbar-nav>li>a { 
	color:#fff; 
}
.navbar_menu.main:hover .navbar-nav>li>a { 
	color: var(--color-primary);
}



/* all Menu */
button.navbar-allmenu { display:none !important; }

/* navbar - m */
.navbar-default .navbar-toggle { 
	float: none;
	position:absolute;
	right:0; top:0;
	border:0; 
	background-color: var(--color-accent-dark); 
	margin:0; padding:0; 
	width: var(--header-height-md); height: var(--header-height-md); 
	border-radius:0; 
}
.navbar-default .navbar-toggle:focus, 
.navbar-default .navbar-toggle:hover { 
	background-color: var(--color-accent); 
}

.navbar-default .navbar-toggle .icon-bar { 
	width:20px; height:2px; 
	background-color: #fff; 
	margin:0 auto; 
}
.navbar-default .navbar-toggle .icon-bar:not(:nth-child(1)) { margin-top:6px; }



	@media (min-width:768px) {
		.navbar-right .dropdown-menu {
			right: inherit;
			left: auto;
		}
	}


	@media (max-width: 1440px) {
		.navbar_menu .navbar-nav {
			margin-left:0;
			margin-right: 0; 
		}
	}

	@media (max-width: 1024px) {	
		.navbar_menu .navbar_menu_inner .container { 
			padding: 0 20px;
			height: var(--header-height);
		}
		.navbar_menu:hover { 
			height: 270px;
		}
	
		.navbar .dropdown-menu li a { 
			font-size:14px;
		}

		
	}
	@media (max-width: 768px) {	
		.navbar-header {
			position: fixed !important;
			top: 0; left: 0; right: 0;
			width: 100%;
			height: var(--header-height-md);
			background: #fff;
			z-index: 200000; /* ensure on top */
			border-bottom: 1px solid  var(--color-bg-gray);
			box-shadow:  var(--shadow-sm);
		}	
		.navbar-default .navbar-brand { 
			height: var(--header-height-md); 
			margin-left:0;
		}
		.navbar_menu .navbar-nav {
			margin:0; 
			
		}

		.navbar_menu .navbar_menu_inner .container { 
			height: var(--header-height-md); 
			padding:0 var(--header-height-md) 0 15px;
		}
		/* 사용안함 */
		.navbar_menu:hover { 
			height: auto;
			box-shadow:  var(--shadow-sm);
		}
		.navbar_menu:hover .navbar-nav>li.dropdown>.dropdown-menu {
			display: none;
		}
		.navbar_menu .navbar-nav>li>a:hover::before,
		.navbar_menu .navbar-nav>li.dropdown:hover>a::before,
		.navbar_menu .navbar-nav>li>a:hover::after,
		.navbar_menu .navbar-nav>li.dropdown:hover>a::after {
			top: 18px; 
		}

		.navbar_menu.main .navbar-nav>li>a { 
			color: var(--color-primary);
		}
		.navbar_menu .navbar-nav>li>a {
			line-height: var(--header-height-md); 
		}

		.navbar_menu .navbar_menu_inner .container .row .language_select {
			margin-right:5px;
		}
		.navbar_menu .navbar_menu_inner .language_select a {
			padding: 5px 10px;
		}
		.navbar-default .navbar-toggle { display: block !important;}

	}
	@media (max-width: 750px) {	
		/* 메인메뉴바 숨김 */
		.navbar_menu .navbar_menu_inner .container .row>.navbar-collapse {
			display: none !important;
		}
	}






/* side_menu - m */
#side_menu { display:block; position:fixed; top:0; right:0; width:100%; height:100%; overflow:hidden; z-index:999999; margin:0; background-color:rgba( 0, 0, 0, 0.5 ); display:none }
#side_menu .side_wr { width:250px; background:#fff; opacity:1; position:absolute; top:0; right:0; box-shadow:0 0 10px #000; overflow-x:hidden; height:100%; overflow-y:auto }
#side_menu .side_wr .side_inner_rel { position:relative; height:100%; display:block; overflow:auto; }
#side_menu .side_wr .side_inner_abs { position:absolute; width:100%; display:block; -webkit-tap-highlight-color:rgba(0,0,0,0); width:100%; -webkit-transform:translateZ(0); -moz-transform:translateZ(0); -ms-transform:translateZ(0); -o-transform:translateZ(0); transform:translateZ(0); -webkit-touch-callout:none; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; -webkit-text-size-adjust:none; -moz-text-size-adjust:none; -ms-text-size-adjust:none; -o-text-size-adjust:none; text-size-adjust:none }

#side_menu .m_menu li { display:block; line-height:3.571rem; position:relative; border-bottom:1px #e7e7e7 solid; }
#side_menu .m_menu li a.text_link { display:inline-block; width:85%; white-space:nowrap; padding-left:20px; color:#333; font-size:1.143rem; }
#side_menu .m_menu li a.text_link:hover { color:var(--color-accent) !important; }
#side_menu .m_menu li a.subopen { color:#666; }
#side_menu .m_menu span { position:absolute; right:20px; top:15px; } 

#side_menu li, #side_menu li>a, #side_menu li.active>a, #side_menu li>a:hover, #side_menu li>a:focus {  text-decoration:none; }
#side_menu .dropdown-custom-menu { background:#f9f9f9; overflow:hidden; width:100%; display:none; border-top:1px #eee solid; }
#side_menu .dropdown-custom-menu li { border-bottom:1px #eee solid !important; background:none; }
#side_menu .dropdown-custom-menu li:last-child { border-bottom:0 !important; }
#side_menu .dropdown-custom-menu li a { color:#333; padding-left:25px; display:block; width:100%; line-height:2.857rem; }
#side_menu .dropdown-custom-menu li a:hover { color:#333; background-color:#f5f5f5; }

#side_menu .dropdown-custom-menu ul { padding:10px 0; background-color:#fff; border-bottom:1px #eee solid; }
#side_menu .dropdown-custom-menu ul li { border-bottom:0 !important; }
#side_menu .dropdown-custom-menu ul li a { color:#888; line-height:1.857rem; font-size:1rem; padding-left:30px; }
#side_menu .dropdown-custom-menu ul li a:hover { color:#333; background:none; }
#side_menu .dropdown-custom-menu ul li a:before { content:"-"; display:inline-block; }


#side_menu .m_login { text-align:center; margin:10px; }
#side_menu .m_login span { padding:0 5px; }
#side_menu .m_board { background:#000; clear:both; margin:0; }
#side_menu .m_board li { display:block; line-height:2.857rem; position:relative; padding-left:35px; }
#side_menu .m_board li a:hover { color:#7080b1; }
#side_menu .m_board span { position:absolute; top:13px; left:10px; padding-right:10px; }
#side_menu .m_search { margin:0 auto; padding:20px 0 0; width:100%; text-align:center; }

#side_menu .m_menu_top { height:60px; background-color: var(--color-accent-dark) !important; position:relative; display: flex; align-items: center; }
#side_menu .m_menu_top .m_close { cursor:pointer; font-size:0; width:20px; height:20px; border: 1px; position: relative; margin:0 20px 0 auto;}
#side_menu .m_menu_top .m_close:before,
#side_menu .m_menu_top .m_close:after { content:""; display:block; background-color:#fff; width:22px; height:2px; position:absolute; top:45%; }
#side_menu .m_menu_top .m_close:before { transform:rotate(45deg); }
#side_menu .m_menu_top .m_close:after { transform:rotate(-45deg); }

/* common */
.wrapper { margin:0 auto; overflow:hidden; width:100%; }
.view-all { float:right;width:75px;position:absolute;top:10px;right:0; }
.form-control { background-color:#fff; background-image:none; border:1px solid #e5e6e7; border-radius: 6px; color:inherit; display:inline-block; padding:6px;
                font-size:1rem; vertical-align:middle; box-shadow:none; }
.control-label { color:#333; }

.panel-heading { font-size:1rem; }

.btn { font-size:16px; text-shadow:none; box-shadow:none; padding:0 30px; line-height: 46px; border-radius: 50px !important; font-weight:500; }
.btn_Hangang { background-color: #000; color: #fff;}
.btn_Hangang:hover { background-color: #000; color: #fff; box-shadow: 0 0 20px rgba(0,0,0,.2);}
.btn-xs { font-size:1rem; padding:0 15px; line-height:2.429rem; border-radius:0; }

.checkbox-inline, .radio-inline { font-weight:inherit; }

@media (max-width: 1024px) {
}
@media (max-width: 768px) {
	.btn { font-size: 14px; line-height: 46px; padding: 0 30px;}		
	.btn-xs { padding:0 10px; }
}
@media (max-width: 425px) {
	.btn { font-size: 12px; line-height: 34px; padding: 0 20px;}	
}


/* header : 로그인 상태 */
.header_top_line {height: 40px;}
header { 
	background:#222; color:#fff; clear:both; width:100%; 
	position: fixed; bottom: 0; z-index: 999999;
}
header .container {width: 100% !important}
header .header-top-menu { height:30px; display: flex; align-items: center;justify-content: flex-end }
header .header-top-menu .fa { color:#ccc; }
header .header-top-menu li { float:left; padding:0 10px; color:#ccc; font-size:0.857rem; }
header .header-top-menu li a { color:#ccc; font-size:16px; }
header .fa { padding-right:5px; }
header .badge { margin-left:5px; font-size:0.714rem; }

.header_line {background:#082a47; height:3px; line-height:3px;clear:both; width:100%; display:none; }

.notifications{position:relative;cursor:pointer; }
.notifications-list {color:#060606;border-bottom:1px solid #ededed;display:block;overflow:hidden;line-height:1.786rem; }
.notifications-list a:link{color:#060606; }
.notifications-list a:active,
.notifications-list a:hover {color:#2773ae; }
.notifications-menu{position:absolute; top:100%; left:0; z-index:9999; display:none; width:330px; background-color:#f5f5f6; -webkit-border-radius:0 0 3px 3px; -webkit-background-clip:padding-box; -moz-border-radius:0 0 3px 3px; -moz-background-clip:padding; border-radius:0 0 3px 3px; background-clip:padding-box; -moz-box-shadow:0 1px 0px rgba(0,0,0,.05); -webkit-box-shadow:0 1px 0px rgba(0,0,0,.05); box-shadow:0 1px 0px rgba(0,0,0,.05); border:1px solid #f8f8f8; padding:5px 15px; }
.notifications-menu .external { background-color:#FFF; display:block; }
.notifications-menu .external a { background-color:#fff; color:#e9423f; }
.notifications-list .point{ color:#ec5956 !important; text-align:center; }
.notifications-list span{ padding-top:10px; font-size:0.786rem; }

.m_nav { padding:8px 10px 0 0; }
nav, .pagination{text-align:center; }

body.over_hidden{overflow:hidden} 


/* footer */
footer { background-color: #fff; position: relative;  }
footer .container { background: url(../images/LogoFooter.png) no-repeat right 85%; position: relative;}
footer .container .row {padding: 40px 0; border-top: 1px solid #ccc}
footer .see_mobile { clear:both; margin:0 auto; text-align:center; display:none; } /****** 모바일 버젼으로 보기 숨김처리 **********/

footer .footer-menu { display: flex; justify-content: flex-end; margin-bottom: 20px;} 
footer .footer-menu ul { display: flex; }
footer .footer-menu ul li {padding: 0 10px; border-right: 1px solid rgba(0,0,0,.3); }
footer .footer-menu ul li:last-child { border-right: none; }
footer .footer-menu ul li a { color: rgba(0,0,0,.7); font-size: 16px; }
footer .footer-menu ul li a:hover {font-weight: 600; }
footer .footer-menu ul li .btn_privacy {color: var(--color-accent); font-weight: 400;}

footer .copyright { clear:both; font-size: 14px; color: rgba(0,0,0,.7); }
footer .copyright b {font-weight:normal; }
footer .copyright span { padding-right:7px; }

#GoToTop { position: absolute; right: 15px; top: -30px; background: url(../images/GotoTop.png) no-repeat center var(--color-accent); width: 60px; height: 60px; border-radius: 50%; box-shadow: 0 0 15px rgba(0,0,0,.4); cursor: pointer; z-index: 9999;}


@media (max-width: 1024px) {
	footer { font-size: 14px;}
}
@media (max-width: 768px) {
	footer { font-size: 12px;}
	footer .footer-menu ul li a {font-size: 14px; }
}
@media (max-width: 425px ) {
	footer .container { 
		padding: 0 15px; 
		background-size: 50px; 
		background-position: 95% 80%; }
	footer .container .row { padding: 30px 0 20px; }
	footer .footer-menu { justify-content: flex-start}
	footer .footer-menu ul {justify-content: flex-start}
	footer .footer-menu ul li a {font-size: 13px; }
	footer .footer-menu ul li:first-of-type {padding-left:0;}
	footer .copyright {line-height: 1.2; font-size: 12px;}
	#GoToTop { top: -20px; width: 40px; height: 40px; background-size: 30%; }
}

.media{clear:both; }
.media-body,
.media-left,
.media-right {display:table-cell; vertical-align:top; }
.media-left,
.media>.pull-left { padding-right:10px; }
.media-right,
.media>.pull-right { padding-left:10px; }
.media-heading { font-size:1rem; overflow:hidden; }
.media-body .media-info { font-size:0.786rem; color:#666; }
.media-body .media-info span { padding-right:10px; }


/* sidebar */
.sidebar { border:1px solid #e5e5e5; padding:20px; }
.sidebar .headline { border-bottom:1px dotted #ccc; display:block; margin-bottom:15px; }
.sidebar .headline h3 { border-bottom:2px solid #3498db; display:inline-block; margin:0 0 -2px; padding-bottom:5px; font-size:1.071rem; }
.sidebar .loginbox { overflow:hidden; }
.sidebar .loginbox .text { padding-top:7px; }
.sidebar .loginbox .text li { float:left; padding-right:7px; }
.sidebar .welcome { overflow:hidden; }
.sidebar .welcome ul { overflow:hidden; }
.sidebar .welcome li { float:left; padding-right:5px; padding-bottom:5px; }
.sidebar .sidebar_latest li { padding-bottom:10px; }

.sidebar .tag-clouds{overflow:hidden; }
.sidebar .tag-clouds ul li{float:left; padding-right:10px; }


/* modal */
.modal .modal-body .number { padding-bottom:10px; }
.modal .modal-body .profile-info{overflow:hidden; }


.help-inline { display:inline-block;color:#737373;margin-left:10px; padding-top:7px;vertical-align:middle; }
.nopost {text-align:center; padding:120px 0 !important; }

textarea.dhtmleditor  { width:100%;height:350px; }

.latest_comment_count { font-size:0.786rem; color:#FF7700; margin-left:5px;font-weight:bold; }
.highlight { font-weight:bold; color:#2f6bc5; }


/* Sideview */
#nameContextMenu { background:#000; color:#fff; padding:4px 8px 6px;z-index:10000; }
#nameContextMenu a { color:#fff; font-size:0.857rem; line-height:1.429rem; display:block; }
#nameContextMenu a:hover { color:#ff0000; }
#nameContextMenu td { border:0px !important; }


/* main */
.main .navbar-form { margin-top:0; margin-bottom:0; padding:0; }
.main_index .sub_title_img { display:none; }

.container { width: 1320px; margin: 0 auto;}

.main,
.main_index .container,
.main_visual .container { width:100%; clear:both;  margin:0 auto; padding:0; }

footer .container,
.MainCon .container { width: 1320px !important; margin: 0 auto;}




/************ MAIN ******************/
/* main section indicator */
.section-indicator {
	position: fixed;
	right: 30px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 9999;
	display: flex;
	flex-direction: column; 
}
.section-indicator a {
	width: 3px;
	height: 40px;
	background: rgba(0, 0, 0, 0.3);
	display: block;
	transition: all 0.2s ease-in-out;
	position: relative;
}
.section-indicator a:hover,
.section-indicator a:focus {
	background: var(--color-primary);
}
.section-indicator a.active::before {
	color: var(--color-accent);
}
.section-indicator a.active {
	background: var(--color-accent);
}

.section-indicator a::before {
	content: attr(data-label);
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	color: rgba(0, 0, 0, 0.7);;
	font-size: 14px;
	font-weight:400;
	line-height: 1;
	white-space: nowrap;
}
@media (max-width: 1024px) {
	.section-indicator a::before {
		display: none;
	}
}
@media (max-width: 768px) {
	.section-indicator { display: none; }
}

/* bxslider */
.bx-wrapper { margin-bottom:inherit; border:0; box-shadow:none; }
.bx-wrapper .bx-pager { bottom: 240px; padding-top: 0; display: flex; align-items: center; justify-content: center; }
.bx-viewport { height:inherit !important; }

/* 슬라이드 이미지 불러오기위한높이 조정 26-01-26 */
.bxslider img { width: 100%; height: auto; display: block; }

/* 슬라이드 이미지 줌인/줌아웃  26-01-26*/
.mainslide-zoom-in img {
  animation: mainslideZoomIn 3s ease-in-out both;
}
.mainslide-zoom-out img {
  animation: mainslideZoomOut 3s ease-in-out both;
}
@keyframes mainslideZoomIn {
  0% { transform: scale(1); }
  100% { transform: scale(1.1); }
}
@keyframes mainslideZoomOut {
  0% { transform: scale(1.1); }
  100% { transform: scale(1); }
}

.bx-wrapper .bx-pager.bx-default-pager a { width: 8px; height: 8px; background: #fff; border: 1px #fff solid; border-radius: 50%;}accent
.bx-wrapper .bx-pager.bx-default-pager a.active { background-color: #fff !important; background: transparent !important; border: 3px var(--color-primary) solid; width: 12px; height: 12px;}

.bx-wrapper .bx-controls-direction a { 
	top: auto; bottom: 30%;
	width: 133px;; height:30px; display:block; opacity:0.8; filter:alpha(opacity=80); margin-top: 0; 
	background: url(../images/MainArrowhalf.png) no-repeat center;
}
.bx-wrapper .bx-controls-direction a:hover { opacity:1; filter:alpha(opacity=100);  }

.bx-wrapper .bx-prev {  left: 42%; }
.bx-wrapper .bx-next {  right: 42%; transform: scaleX(-1); }

.bx-wrapper .bx-prev:hover, .bx-wrapper .bx-prev:focus {
	opacity:1; filter:alpha(opacity=100); background-position: 0;
	transform: translateX(-20px);
}
.bx-wrapper .bx-next:hover, .bx-wrapper .bx-next:focus {
	opacity:1; filter:alpha(opacity=100); background-position: 0;
	transform: translateX(20px) scaleX(-1);
}



/* main_visual */
.main_visual { width:100%; position:relative; }
/*  아래표시 화살표 숨김처리
.main_visual:after { content: ""; display: block; position: absolute; width: 23px; height: 30px; background: url(../images/MainArrow.png) no-repeat center; z-index: 999999; left: 50%; margin-left: -11.5px; bottom: 100px;} */
.main_visual .container { height:100vh; position: relative; display: flex; align-items: center; justify-content: center; flex-direction: column; }
.main_visual .bxslider li { background-repeat:no-repeat; background-size:cover !important; background-position:center center !important; position:relative; overflow:hidden; }

.mainslide-bg-wrap { width:100%; height:100%; z-index:1; pointer-events:none; }
.mainslide-bg { width:100%; height:100%; object-fit:cover; object-position:center center; display:block; transform-origin:center center; z-index:1; will-change: transform; }

/* pan left-right while slightly scaled (desktop only) */
.mainslide-pan .mainslide-bg {
	/* keep image slightly scaled so horizontal panning doesn't reveal edges */
	transform: scale(1.12) translateX(0);
	animation: mainslidePanLR 8s ease-in-out infinite alternate;
}
@keyframes mainslidePanLR {
	0% { transform: scale(1.12) translateX(0%); }
	100% { transform: scale(1.22) translateX(5%); }
}

.main_visual .bxslider:after { content:""; display:block; clear:both; }


.mainslide-text-wrap  { 
  position: absolute;
  left: 0; top: 0; width: 100%; height: 100%;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  z-index: 2;
  pointer-events: none;
}
.MainTxt_1 { font-size: 60px; color: rgba(0,0,0, 1); font-weight: 700; line-height: 1.2;/* text-shadow: 3px 0 10px rgba(0,0,0,.3);  */  text-align: center;}
.MainTxt_2 { font-size: 26px; color: rgba(0,0,0, 1);  font-weight: 300;  margin-top: 15px;text-align: center; }


@media (max-width: 1024px) {
	.main_visual .container { height: 800px; }
	.MainTxt_1 { font-size: 46px; }
	.MainTxt_2 { font-size: 14px; margin-top: 10px; }
}
@media (max-width: 768px) {
	.main_visual .container { height: 500px; }
	.MainTxt_1 { font-size: 34px; }
	.MainTxt_2 { font-size: 12px; }
}
@media (max-width: 425px) {	
	.main_visual .container { height: 100%; }
	.main_visual .bxslider_mobile { display: block !important }
	.main_visual .bx-controls,
	.main_visual:after{ display: none !important }

	.MainTxt_1 { font-size: 20px; line-height: 1.4; margin-top: 50px;}
	.MainTxt_2 { font-size: 13px; width: 70%; margin: 0 auto;}
}





/* MainCon */
.MainCon { padding: 120px 0;}
.MainTitleBox { display: flex; flex-direction: column; gap: 15px;}
.MainTitle_1 { font-size: 18px; font-weight:500; color: var(--color-accent); line-height: 1;}
.MainTitle_2 { font-size: 50px;  font-weight:700; color: var(--color-primary); line-height: 1.1; }
.MainTitle_3 { font-size: 20px;  font-weight:300; color: var(--color-menu2); line-height: 1.4; font-weight:400; margin-top: 12px;}

@media (max-width: 1024px) {
	.MainCon { padding: 80px 15px;}
	.MainTitleBox { gap: 10px;}
	.MainTitle_1 { font-size: 18px; }
	.MainTitle_2 { font-size: 40px; }
	.MainTitle_3 { font-size: 16px; }
}
@media (max-width: 768px) {
	.MainCon { padding: 60px 15px;}
	.MainTitle_1 { font-size: 14px; }
	.MainTitle_2 { font-size: 32px; }
	.MainTitle_3 { font-size: 12px; }
}
@media (max-width: 425px) {
	.MainTitle_2 { font-size: 26px;}
}




/* MainBusiness */
.MainBusiness { background: url(../images/main_section1_bg.jpg) no-repeat center top; min-height: 100vh; padding: 80px 0; }
.MainBusiness .MainTitleBox { align-items: center; text-align: center; margin-bottom: 70px; }

/* MainBusiness 5열 1줄 grid */
.MainBusiness .row {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
	align-items: center;
	min-height: 447px;
}

.MainBusiness .row::before, .MainBusiness .row::after {display: none;}

.MainBusinessBox {
	max-width: 246px; height: 388px; 
	background: no-repeat center#ccc; background-size: 100%; 
	display: flex; flex-direction: column; justify-content: flex-end; 
	cursor: pointer; 
	transition:all 0.2s ease-in-out 0s;
	box-shadow: 0 16px 40px 0 rgba(49,50,127,0.18), 0 2px 8px 0 rgba(0,0,0,0.10)
}
.MainBusinessBox:hover {
	background-size: 120%;
	height: 447px;
	transition: all 0.2s ease-in-out 0s;;
}
.MainBusinessTitle { 
	margin-left: 20px; 
	font-size: clamp(12px, 2vw, 16px); 
	line-height: clamp(15px, 1.4vw, 24px);
	letter-spacing: 0; 
	font-weight: 300;  
	color: #fff; 
	margin-bottom: 3.5rem 
}
.MainBusinessTitle strong { font-size:26px;  font-weight: 700; line-height: 1.1; }

.MainBusinessBox_1 { background-image: url(../images/main_business1_bg.jpg); border-top-left-radius: 60px; }
.MainBusinessBox_2 { background-image: url(../images/main_business2_bg.jpg);}
.MainBusinessBox_3 { background-image: url(../images/main_business3_bg.jpg);}
.MainBusinessBox_4 { background-image: url(../images/main_business4_bg.jpg);}
.MainBusinessBox_5 { background-image: url(../images/main_business5_bg.jpg);border-top-right-radius: 60px;}

@media (max-width: 1440px) {
	.MainBusiness .row {width: 85%; margin:0 auto;}
}

@media (max-width: 1024px) {
	.MainBusiness .row {min-height: 300px;}
	.MainBusiness .MainTitleBox { margin-bottom: 50px;}
	.MainBusinessBox { height: 260px; }
	.MainBusinessTitle { font-size: 14px;}
	.MainBusinessTitle strong {font-size: 21px; font-weight: 500; margin-bottom: 0; }
}
@media (max-width: 768px) {
	.MainBusiness {min-height: 500px; height:auto; padding: 60px 0; }
	.MainBusiness .MainTitleBox { margin-bottom: 30px;}
	.MainBusiness .row {grid-template-columns: repeat(3, 2fr); justify-content: end; /* 마지막 줄 아이템들을 오른쪽으로 몰기 */
	}
	
	.MainBusinessBox { height: 190px; margin-bottom: 30px; }
	.MainBusinessBox:hover {
		height: 190px; /* hover height matches .MainBusinessBox */
	}
	.MainBusinessBox_5 {
		border-top-right-radius: 0;
		border-bottom-right-radius: 60px;
	}
	.MainBusinessTitle { font-size: 12px; line-height: 20px; margin-bottom: 1.5rem;}
	.MainBusinessTitle strong {font-size: 22px; font-weight: 600;}
	
}
@media (max-width: 425px) {	
	.MainBusiness {padding: 30px 0; }
	.MainBusiness .row {
		grid-template-columns: 1fr;
		width: 75%;
		gap: 10px;
	}
	.MainBusiness .MainTitle_3 {}
	.MainBusinessBox { height: 100px; max-width: 100%; margin-bottom:0;}
	.MainBusinessTitle { font-size: 12px; line-height: 15px; margin-bottom: 0.5rem;}
}

/* @media (max-width: 1024px) {
	.MainBusiness .row {
		grid-template-columns: repeat(3, 1fr);
	}
}
@media (max-width: 768px) {
	.MainBusiness .row {
		grid-template-columns: repeat(2, 1fr);
	}
} */



/* Overview */
.Overview { 
	background: url(../images/main_section2_bg.jpg); 
	min-height: 100vh; 
	padding: 80px 0;
}
.Overview .container {
	padding-left: 26%; 
	padding-top: 120px;
}
.Overview .MainTitleBox {  width: 80%; }

.OverviewInnerBox {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: center;
	margin-top: 80px;
	width: 507px;
}
.OverviewInnerBox a {
	border-right: 1px solid rgba(0,0,0,.1);
}
.OverviewInnerBox a:last-of-type {
	border-right: none;
}
.OverviewBox { 
	display: inline-flex; 
	flex-direction: column; 
	justify-content: center; 
	align-items: center;
	gap: 20px; 
	padding: 12px 20px;
	margin: 0 2px;
	width: 165px;
	height: 145px;
}

.OverviewBox .OverviewTxt_2 {
	font-size: 16px;
	font-weight:600;
}

/* Overview icons: use CSS background images and swap to _over versions on hover */
.OverviewIcon { width:64px; height:64px; display:block; background-repeat:no-repeat; background-position:center; background-size:contain; }
.OverviewIcon_1 { background-image: url(../images/main_overview_icon1.png); }
.OverviewIcon_2 { background-image: url(../images/main_overview_icon2.png); }
.OverviewIcon_3 { background-image: url(../images/main_overview_icon3.png); }
.OverviewBox:hover .OverviewIcon_1 { background-image: url(../images/main_overview_icon1_over.png); }
.OverviewBox:hover .OverviewIcon_2 { background-image: url(../images/main_overview_icon2_over.png); }
.OverviewBox:hover .OverviewIcon_3 { background-image: url(../images/main_overview_icon3_over.png); }

/* Preload _over images to prevent flicker on hover */
.OverviewIcon::after {
	content: "";
	display: block;
	width: 0;
	height: 0;
	overflow: hidden;
	background-image: url(../images/main_overview_icon1_over.png), url(../images/main_overview_icon2_over.png), url(../images/main_overview_icon3_over.png);
	background-size: 0 0;
}
.OverviewBox:hover {
	background-color: var(--color-accent);
	transition: all 0.3s ease-in-out 0s;
}
.OverviewBox:hover .OverviewTxt_2 {
	color: #fff;
	transition: all 0.2s ease-in-out 0s;
}


	@media (max-width: 1440px) {
		.Overview .container {
			padding-left: 40%;
		}
	}

	@media (max-width: 1024px) {

		.Overview { 
			background-position: top 50% !important; 
			background-size: 1600px;
		}
		.Overview .container {
			padding-left: 16%; 
			padding-top: 20px;
		}
	}
	@media (max-width: 768px) {
		.Overview {
			min-height: auto; height:auto; padding: 60px 0; 
		}
		
	}
	@media (max-width: 425px) {

		
		.Overview {
			background-position: 18% -60px;
			background-size: 1400px auto;	
		}	
		
		.Overview .container {
			padding-left: 5%; 
			padding-top: 0;
		}
		.Overview .MainTitleBox {
			margin-left: 10px;
		}

		.OverviewInnerBox {
			grid-template-columns: repeat(3, 1fr);
			width: 90%;
			margin-top:30px;
			
		}
		.OverviewBox {
			gap: 5px;
			padding: 12px 0	;
			width: 105px;
    		height: 95px;
		}
		.OverviewBox .OverviewTxt_2 {font-size: 14px;}
	}



/* Complaint */
.Complaint { 
	background: url(../images/main_section3_bg.jpg); 
	height: 520px; background-size: cover; 
}
.MainCon.Complaint { padding: 90px 0; }

.Complaint .MainTitleBox {margin-left: 45%;}
.Complaint .btn_qa {
	/* background image moved to pseudo-element to allow filtering */
	position: relative;
	font-size: 22px;
	font-weight: 300;
	border: 1px solid var(--color-primary);
	border-radius: 0 !important;
	padding: 10px 40px;
	padding-right: 80px;
	margin-right: 10px;
	margin-top: 30px;
}
.Complaint .btn_qa::after {
	content: "";
	position: absolute;
	right: 40px;
	top: 50%;
	transform: translateY(-50%);
	width: 11px;
	height: 21px;
	background-image: url(../images/arrow_pixel.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	pointer-events: none;
}

.Complaint .btn_qa:hover {
	background-color: var(--color-accent);
	color: #fff;
	border-color: var(--color-accent);
	box-shadow: 0 0 20px rgba(0,0,0,.2);
	transition: all 0.2s ease-in-out 0s;
}

.Complaint .btn_qa:hover::after {
	/* make the icon appear white (#fff) */
	-webkit-filter: brightness(0) invert(1);
	filter: brightness(0) invert(1);
}


@media (max-width: 1024px) {
	.Complaint .MainTitleBox { gap: 20px;}
}
@media (max-width: 768px) {
	.MainCon.Complaint {padding: 40px 0;}
	.Complaint { height: 320px; }
	.Complaint .MainTitleBox {margin-left: 15%;}
	.Complaint .MainTitle_3 { font-size: 14px;}
	.Complaint .btn_qa {margin-top: 14px; line-height: 30px;}
}
@media (max-width: 425px) {

	.Complaint .MainTitleBox { gap: 10px; margin:0 20px;}
	.Complaint .MainTitle_2 { font-size: 20px;}
	.Complaint .MainTitle_3 { font-size: 12px;}

	
	.Complaint .btn_qa {
		line-height: 20px;
		margin-top:5px;
		font-size: 16px;
		font-weight: 600;
		background-color: rgba(255,255,255,0.5);
		padding: 10px 20px;
		padding-right: 40px;
    }
	.Complaint .btn_qa::after {
		right: 20px;
		width: 8px;
		height: 15px;
	}
}






/* MainContactus/MainNotice */
.MainBottom { 
	background-color: #ededed; 
	display: flex;
	flex: 1 1 40%;
	height: 400px;
	align-items: stretch;
}
.MainCon.MainBottom {padding:0; }

.Contact { 
	width: 40%; 
	background: url(../images/main_section4_contactus_bg.jpg) no-repeat center top; 
	background-size: 100% auto; 
	padding:52px 67px;   
}
.Contact .MainTitleBox { 
	display: flex; 
	flex-direction: column; 
	justify-content: center; 
	align-items: flex-end;
	gap: 5px;
}
.Contact .MainTitle_2,
.Contact .MainTitle_3	{ 
	text-align: right;
	color: rgba(255,255,255,1);
}
.Contact .MainTitle_2 {
	font-size: 40px; 
	font-weight:600; 
	margin-top: 40px;
}
.Contact .MainTitle_3 {
	font-size: 30px; 
	font-weight:400; 
	margin-top: 0;
	margin-bottom: 32px;
}

.Contact .btn_contact {
	/* background image moved to pseudo-element to allow filtering */
	position: relative;
	display: block;
	font-size: 22px;
	font-weight: 300;
	color: #fff;
	border: 1px solid #fff;
	border-radius: 0 !important;
	padding: 10px 40px;
	padding-right: 80px;
	margin-top: 10px;
}
.Contact .btn_contact::after {
	content: "";
	position: absolute;
	right: 40px;
	top: 50%;
	transform: translateY(-50%);
	width: 11px;
	height: 21px;
	background-image: url(../images/arrow_pixel.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	pointer-events: none;
	-webkit-filter: brightness(0) invert(1);
	filter: brightness(0) invert(1);
}

.Contact .btn_contact:hover {
	background-color: var(--color-accent);
	border-color: var(--color-accent);
	box-shadow: 0 0 20px rgba(0,0,0,.2);
	transition: all 0.2s ease-in-out 0s;
}
	@media (max-width: 1440px) {
		.MainBottom {height: 450px;}
		.Contact {  
			background-size:  auto 100%;
		}
	}
	@media (max-width: 768px) {
		
	}
	@media (max-width: 425px) {
		
	}



/* MainNotice */
.MainNotice {width: 60%;  padding: 52px 90px 52px 62px; display: flex; flex-direction: column; }
.MainNotice .MainTitleBox { margin-bottom: 10px; text-align: left; gap: 2px;}
.MainNotice .MainTitle_3 { font-size: 20px; color: rgba(0,0,0,.6); margin-top: 0;}
.MainNotice .MainTitle_2 span { font-weight:400;}
.MainNotice ul {width: 90% }
.MainNotice ul li { background:#fff; margin-bottom: 4px;}
.NoticeTitle { 
	display: flex; 
	align-items: center;
    padding: 30px;
}
.NoticeTitle .date {flex: 1;}
.NoticeTitle a {flex: 9; display: flex; flex-direction: column; gap: 5px;}
.NoticeTitle .Title { font-size: 18px; color: #000; font-weight:700;}
.NoticeTitle .Content { font-size: 16px; color: #666; font-weight:400;  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;}
.NoticeTitle .Arrow {display: none; }
.NoticeTitle a:hover .Title {color: var(--color-primary); border-color: var(--color-primary); transition:all 0.2s ease-in-out 0s;}

 .NoticeTitle:hover .Arrow  {display: block; font-size: 30px; color: #ccc; margin-left: auto; width: 60px; height: 60px; border: 1px #ddd solid; border-radius: 50px; display: flex; align-items: center; justify-content: center; position: absolute; top: 50%; right: 30px;}

@media (max-width: 1440px) {
	.NoticeTitle { 
		flex-direction: column;
		align-items: flex-start;
	}

}


@media (max-width: 1024px) {
	.MainBottom { padding: 60px 0;}
	.MainBottom::after { width: calc(50% - 120px); margin-left: 120px; }
	

	.Contact {flex: 30%;     padding: 52px 34px;}
	.MainNotice {flex: 70%;}

	.Contact .MainTitle_2 { font-size: 30px;}
	.Contact .MainTitle_3 {font-size: 22px;}
}

@media (max-width: 768px) {
	.MainBottom::after { display: none;}
	.MainBottom .container { flex-direction: column; gap: 20px;}
	.Contact { width: 100%;}

	.ContactBox { gap: 10px;}
	.ContactIcon { display: none;}
	.Contact .MainTitle_2 { font-size: 22px;}
	.Contact .MainTitle_3 {font-size: 16px; font-weight:400}
	

	.MainNotice {padding: 52px 34px}
	
	.MainNotice .MainTitleBox { margin-bottom: 30px;}
	
	.MainNotice .MainTitle_2 { font-size: 28px; padding-top: 30px;}
	.MainNotice .MainTitle_2::before { font-size: 60px;}
	.NoticeTitle { gap: 5%; padding: 20px;}
	.NoticeTitle .Title { font-size: 16px;}
	.NoticeTitle .Content { font-size: 14px;}
	.NoticeTitle .Arrow { display: none;}
	.NoticeTitle .Content {white-space: wrap}
}
@media (max-width: 425px) {

	.MainBottom {flex-direction: column; height: auto;}
	.Contact, .MainNotice {width: 100%; flex: 1;}

	
	.Contact .MainTitle_2 {margin-top: 20px;}
	.Contact .MainTitle_3 {margin-bottom: 12px;}

	.NoticeTitle { flex-direction: column; align-items: flex-start; gap: 10px; padding: 15px;}
	.MainNotice .MainTitle_3 {
    	font-size: 16px;
	}
	.MainNotice ul {
		width: 100%;
	}
	.MainNotice .MainTitle_2 { font-size: 16px; padding-top: 20px;}
	.MainNotice .MainTitle_2::before { font-size: 40px;}
	.NoticeTitle .Title { font-size: 18px;}
	.NoticeTitle .Content { font-size: 14px;}
}


/***************************************************************************************************************************************
 sub : common */

/* sub_title_img */
.sub_title_img { 
	/* 
	background:url(../images/SubVisual.png) no-repeat top center; 
	background-size:cover; 
	*/ 
	position: relative; 
	display: flex;
	align-items: flex-start;
    justify-content: flex-end;
    flex-direction: column;
	height:348px; 
}
.sub_title_img h2 { 
	font-size: 50px; 
	color:var(--color-primary); 
	font-weight: 700;
}
.sub_title_img h2 .sub_title_h2_txt1 { 
	display: block; 
	font-size: 16px; 
	color:var(--color-accent); 
	font-weight:600;
	margin-bottom: 20px;
}

.sub_title_img h2 .sub_title_h2_txt2 { 
	display: block; 
	font-size: 18px; 
	color: var(--color-muted);
	font-weight:400;	
	margin-top: 35px;
}

		@media (max-width: 1024px) {
			.sub_title_img { height: 320px; }
			.sub_title_img p { font-size: 34px; }
			.sub_title_img p span { font-size: 12px;}
		}
		@media (max-width: 768px) {
			.sub_title_img { 
				height: 180px; 
				margin-top:20px; /* 메뉴바간격만큼 띄우기 */
			}
			.sub_title_img h2 .sub_title_h2_txt1 {margin-bottom:10px;}
			.sub_title_img h2 .sub_title_h2_txt2 {margin-top: 15px; }
		}
		@media (max-width: 425px) {
			
			.sub_title_img { height: 140px; }
			.sub_title_img p { font-size: 26px; }
			.sub_title_img p span { font-size: 10px;}
			.sub_title_img h2 .sub_title_h2_txt1 {margin-bottom:5px;}
			.sub_title_img h2 .sub_title_h2_txt2 { 	font-size: 14px; margin-top: 10px; }
		}

		t
/* location 숨김처리 */
.location { display: none; line-height: 70px; position: absolute; left: 0; bottom: 0; width: 100%; background-color: rgba(0,0,0,.4); color: #fff; }
.location .container { display: flex; }
.locationHome { font-size: 0; border-left: 1px rgba(255,255,255,.2) solid; border-right: 1px rgba(255,255,255,.2) solid; background: url(../images/Home.png) no-repeat center; width: 80px; }
.locationMenu1 { position:relative; float:left; min-width:240px; }
.locationMenuBtn { position:relative; display:flex; align-items: center; width:100%; color:#fff; padding:0 25px; background: none; border: 0; border-right: 1px rgba(255,255,255,.2) solid;  text-align:left }
.locationMenuBtn span { display:block; width:100%; color:#fff; font-weight:400; font-size:18px; letter-spacing:-0.5px; }
.locationMenuBtn i { font-size: 20px; }
.locationMenu1.open > button i { transform:rotate(-180deg); margin-top:-10px; }
.locationMenu2 { display: none; position:absolute; top:70px; left:-1px; width:calc(100% + 1px); border:1px solid #ddd; border-top:0; background-color:#fff; z-index:999; padding:10px 0; box-shadow: 0 5px 15px rgba(0,0,0,.1); }
.locationMenu2 li a { display:block; padding: 0 25px; line-height: 50px; font-size: 16px; color: #000; word-break:keep-all; text-align: left; font-weight:500;}
.locationMenu2 li a:hover { color: #1257a6; background-color: #f5f5f5; }
.locationMenu2 li.on { position:relative; }
.locationMenu2 li.on a { color: #1257a6; font-weight:600;}

@media (max-width:1024px) {
    .location { line-height: 50px; }
    .locationMenu1 { min-width: 160px; }
	.locationMenu2 { top: 50px;}
	.locationMenu2 li a { font-size: 14px; line-height: 1.1;}
	.locationMenuBtn span { font-size: 14px; }
}
@media (max-width:425px) {
    .location { line-height: 40px; }
    .locationHome { width: 40px; background-size: 30%;}
    .locationMenuBtn { padding: 0 10px; }
    .locationMenuBtn span { font-size: 11px; }
	.locationMenuBtn i { font-size: 16px; }
    .locationMenu1 { min-width: 105px; }
    .locationMenu2 { top: 40px; padding: 0;}
    .locationMenu2 li a { font-size: 11px; padding: 5px 10px; }
}



/* SubMenu */
.sub_menu { width:100%; margin-top:40px; font-weight:500;}
.sub_menu .sub_menu_depth01 { 
	background: var(--color-bg-gray); 
	border-radius: 28px;
	padding: 8px; 
	display: flex;
	gap: 5px;
	min-height: 50px;
}
.sub_menu li a { display:block; width:100%; }
.sub_menu li a:hover { text-decoration:none; }
.sub_menu_depth01>li>a { line-height:44px; font-size:18px; font-weight: 500; padding:0 30px;  border-radius: 25px; color:var(--color-menu); }
.sub_menu_depth01>li>a:hover { background-color: var(--color-bg-dark); color:#fff; }
.sub_menu_depth01>li>a.on { background-color: var(--color-accent); color:#fff; }

/* .sub_menu_depth02 { padding:15px 0 15px 20px; border-bottom:1px #ddd solid; }
.sub_menu_depth02>li>a { line-height:30px; font-size:15px; color:#888; }
.sub_menu_depth02>li>a:before { content:"-"; display:inline-block; padding-right:5px; }
.sub_menu_depth02>li>a:hover,
.sub_menu_depth02>li>a.on { color: var(--color-accent); } */

	@media (max-width:1200px) {
		.sub_menu { margin-top:20px; }
		.sub_menu_depth01>li>a { font-size:18px; padding:0 20px; line-height:30px; }
	}
	@media (max-width:1024px) {
		.sub_menu_depth01>li>a  { 
			font-size:16px;
			padding: 2px 15px;
		}
	}
	@media (max-width:768px) {
		.sub_menu_depth01>li>a {  }
		.sub_menu .sub_menu_depth01 {flex-wrap: wrap; border-radius: 16px; }
	}
	@media (max-width:425px) {	
		.sub_menu_depth01>li>a { 
			font-size:14px;
			padding: 0 10px;
		}
		.sub_menu { margin-top:10px; }
	}




/* sub_con */
.sub_con { padding:80px 0 100px; color:#222; min-height:700px; }
.sub_con:after,
.sub_con_title:after { content:""; display:block; clear:both; }

.sub_con_title { text-align: center; }
.sub_con_title h3 { font-size:40px; color:#000; font-weight:600; }

.sub_con_title .location * {display:none}
.admin_btn { margin-top:100px; text-align:right; }
#viewcomment .sub_con { min-height:inherit; padding:0; }

.sub_con .board { text-align: left; }

.ConTitle { font-size: 20px; line-height: 1; color: #666; margin: 20px auto 60px; width: 100%;font-weight:400; text-align: center}
.ConBoxTitle { font-size: 32px; color: #111; text-align: center; margin-bottom: 60px; font-weight:600; }
.ConBoxTxt { font-size: 28px; color: #111; text-align: center; line-height: 1.4;font-weight:500; }
.ConLine { height: 1px; width: 90%; background-color: rgba(0,0,0,.2); position: relative; margin: 0 auto 60px;}
.ConLine:after { content: ""; display: block; position: absolute; top: -1px; left: 50%; transform: translate(-50%,0); height: 3px; width: 100px; background-color: #2f6bc5;}


@media (max-width: 1024px) {
	.sub_con_title h3 { font-size: 36px;}
	.ConTitle { font-size: 20px; margin: 10px auto 40px;}
	.ConLine { margin-bottom: 40px;}
}
@media (max-width: 768px) {
	.sub_con_title h3 { font-size: 32px;}
	.ConTitle { font-size: 18px; }
	.ConLine { width: 100%; }
}
@media (max-width: 425px) {
	.sub_con { padding: 40px 0;}
	.sub_con_title h3 { font-size: 24px;}
	.ConTitle { font-size: 14px; margin: 10px auto 30px;}
	
	.ConBoxTxt br { display: none;}
	.ConLine { margin-bottom: 30px;}
	.ConLine:after { width: 50px; }
}


/* ready :컨텐츠준비중 */
.ready { width:100%; height:500px; display:table; background-color:#f9f9f9; border:1px #ddd solid; }
.ready_txt_box { display:table-cell; vertical-align:middle; text-align:center; }
.ready_txt01:before { content:"!"; display:block; margin:0 auto 15px; font-size:50px; color:#ccc; border:4px #ddd solid; width:80px; height:80px; line-height:70px; border-radius:50%; }
.ready_txt01 { font-size: 26px; color:#333; }
.ready_txt02 { font-size: 18px; color:#999; font-weight:400; margin-top: 20px; }



/***************************************************************************************************************************************
 contents */

/* CEO Greeting */
.Greeting {}

.GreetingHead {width: 700px;}
	.GreetingSlogan { font-size: 32px; line-height: 1.1; color: var(--color-primary); font-weight:800; margin-bottom: 20px;}
	.GreetingSlogan strong {color: var(--color-accent-dark); font-weight:800;}
	.GreetingHead .ConLine {width: 100%; position: relative;}
	.GreetingHead .ConLine:after {
		content: "";
		display: block;
		position: absolute;
		top: -5px;
		left: 100%;
		transform: translateX(-100px);
		right: 0;
		height: 6px;
		width: 100px;
		background-color: var(--color-accent-dark);
	}


.GreetingContent {display: flex; gap: 0; flex-direction: row;}
.GreetingTxt {flex:1; font-size: 18px; color: #333; line-height: 32px; text-align: left;}
.GreetingTxt p {margin-bottom: 30px;}
.GreetingTxt span { color: #000; font-weight:600; padding-left: 20px; }
.GreetingImg {flex:1;}

		@media (max-width: 1024px) {
			.GreetingSlogan { font-size: 40px; }
			.GreetingTxt {flex: 2}
			.GreetingImg {flex: 1} 
			.GreetingTxt { font-size: 16px; line-height: 24px; margin-bottom: 50px;}
		}
		@media (max-width: 768px) {
			.GreetingHead {width: 100%}
			.GreetingSlogan { font-size: 30px; margin-bottom: 30px;}
			.GreetingTxt { margin-bottom: 50px;}
			.GreetingLogo { width: 160px; height: 100px; background-size: 40%; }
		}
		@media (max-width: 425px) {
			.GreetingContent {flex-direction: column;}
			.GreetingSlogan { font-size: 22px; line-height: 26px; margin-bottom: 20px;}
			.GreetingTxt { font-size: 14px; line-height: 18px; margin-bottom: 20px;}
			.GreetingLogo { width: 100px; height: 60px; }
		}



/* History */
.HistoryBox {position: relative}
/* 밑줄 */
.HistoryBox::before { content: ""; display: block; position: absolute; top: 0; left:  50%; width:1px; height: 100%; background: var(--color-primary); opacity: .3; z-index: 0;}
.HistoryList { display: flex; flex-direction: column; gap: 30px 0; width: clamp(85%, calc(85% + 10vw), 100%); margin: 0 auto; position: relative; z-index: 1; }
.HistoryList > li { 
	width: 50%; box-sizing: border-box; 
	display: flex;  align-items: flex-start; flex-direction: column; 
	line-height: 1; padding: 0 20px; 
}
/* 홀짝으로 좌/우 교차 배치: 홀수는 우측(라인 오른쪽), 짝수는 좌측(라인 왼쪽) */
.HistoryList > li:nth-child(odd) {
    transform: translateX(102%);
    width: 50%;
}
.HistoryList > li:nth-child(even) { 
    transform: translateX(24%);
	width: 40%;
}

.HistoryYear { 
	width: 100%;
	color: var(--color-primary); font-size: 32px; font-weight:700; 
}
.HistoryYear::after {
	content: "";
	display: block;
	height: 14px;
	width: 100%;
	background-color: var(--color-accent);
	opacity: 0.3;
	transform: translateX(-10%) translateY(-13px);
}
	.HistoryList > li:nth-child(even) .HistoryYear::after {
		width: 110%;
		transform: translateX(0)  translateY(-13px);
	}
.HistoryTxt { color: #222; font-size: 18px; line-height: 1.5; text-align: left;}

/* 리스트 앞 컬러 마커 */
.HistoryTxt ul > li { display: flex; flex-direction: row; align-items: center; align-items: flex-start }
.HistoryTxt ul > li::before {
	content: "";
	width: 6px;
	height: 6px;
	background: var(--color-accent);
	border-radius: 50%;
	margin-right: 5px;
	margin-top: 12px
}



		@media (max-width: 1024px) {
			.HistoryList {width: 100%;}
			.HistoryList > li:nth-child(odd) {
				transform: translateX(100%);
				width: 50%;
			}
			.HistoryList > li:nth-child(even) { 
				transform: translateX(0%);
				width: 50%;
			}
		}
		@media (max-width: 768px) {
			.HistoryYear { font-size: 26px; line-height: 1;}
			.HistoryMonth { font-size: 20px; }
			.HistoryTxt { font-size: 16px; }
		}
		@media (max-width: 525px) {
			.HistoryBox::before {display: none;}
			.HistoryList { gap: 10px; width: 100%}
			/* 모바일에서는 한 열로 변경 */
			.HistoryList > li { width: 100% !important; transform: translateX(0%) !important; margin-bottom: 30px; padding:0 10px;  }

			.HistoryYear { font-size: 26px; line-height: 1; width: auto; }
			.HistoryYear::after {width: auto; transform: translateX(0)  translateY(-13px); }
			.HistoryList > li:nth-child(even) .HistoryYear::after {	width: 100%;}
			.HistoryTxt { font-size: 16px; }
		}



/* Location */
.LocationBox { display: flex; margin-bottom:30px;}
.LocationTxt { flex: 1 }
.LocationTxt h4 {font-size: 30px; font-weight: 700; color: var(--color-primary); margin-top: 30px;}
.LocationTxt h4::after {
	content: "";
	display: block;
	height: 14px;
	width: 40%;
	background-color: var(--color-accent);
	opacity: 0.3;
	transform: translateX(-0) translateY(-13px);
}
.LocationTxt p {font-size: 18px; font-weight: 500; color: var(--color-secondary); }
.LocationMap { flex: 2; border-radius: 30px; }

		@media (max-width: 525px) {
			.LocationBox { flex-direction: column}
			.LocationTxt, .LocationMap { flex: auto;}
			.LocationMap {height: 250px !important;}
		}




/* Business */
.BusinessBox {}
.BusinessTit {display: flex; flex-direction:column; align-items: center; text-align: center;}
.BusinessTit .title1 {font-size: 32px; font-weight: 700; line-height: 1.3; margin-bottom:30px; width: 80%;}
.BusinessTit .title2 {font-size: 18px; font-weight: 300; line-height: 1.3; width: 70%;}

		
	.Business_3 .BusinessTit .title1,
	.Business_3 .BusinessTit .title2  {font-size: 30px !important;}
	
	.Business_3 .BusinessTit .title1 { margin-bottom: 0;}

.BusinessProcess ul {
	width: 1200px;
	margin:30px auto;
	display: grid; 
	grid-template-columns: 147px 50px 147px 50px 147px 50px 147px 50px 147px 50px 147px; 
	align-items: center;  justify-items: center; justify-content: center; gap: 3% 0;	
}
.BusinessProcess ul li {  
	position: relative;
	display: flex; align-items: center; justify-content: center;
	width:8vw; height: 8vw; border-radius: 35%; 
	min-width:120px; min-height: 120px; 
	border: 1px solid var(--color-accent);
	font-size: 18px; font-weight: 300; color: var(--color-accent); 
	text-align: center;
}
.BusinessProcess ul li.end {color: #fff; background: var(--color-accent);}
.BusinessProcess ul li.arrow {
	background: url(/views/_layout/hd/images/process_arrow.png) no-repeat center center;
	background-size: 14px 14px;
	border: 1px solid transparent;
}


@media (max-width: 1024px) {
	.BusinessProcess ul {
		width: 450px;
		grid-template-columns: 147px 20px 147px 20px 147px 20px; /*   2줄 열 크기 정의 */
	}
}
@media (max-width: 768px) {

	.BusinessTit .title1 {font-size: 24px;}

	.BusinessProcess ul li {
		flex-wrap: wrap;
	}
	
}
@media (max-width: 425px) {

	.BusinessTit .title1 {font-size: 22px;}
	.BusinessTit .title2 {font-size: 16px; }
	.BusinessProcess ul {
		width: 100%;
		grid-template-columns: auto 20px auto 20px; /*   23줄 열 크기 정의 */
	}
	.BusinessProcess ul li {
		width:3vw; height: 3vw; 
		min-width:100px; min-height: 100px; 
	}
	
}

.BusinessFeature {margin-top: 100px; 
	display: flex; 
	flex-direction:column; 
	align-items: flex-start;
	gap: 50px;
}
	

.FeatureBox {display: flex; flex-direction:row; align-items: flex-start; width: 100%; gap:50px; }
.FeatureBox h3.BoxTit {
	font-size: 26px; font-weight: 600; line-height: 1.2; 
	display: flex; flex-direction: row; align-items: center;  
	width: 300px;       /* 고정 너비 */
	flex-shrink: 0;     /* 줄어들지 않도록 고정 */
}
.FeatureBox h3.BoxTit:before {
	content:''; background:url(/views/_layout/hd/images/business_icon.png) no-repeat center center;    display: inline-block;
    width: 38px;
    height: 39px;
	margin-right: 10px;
}
	/* bisiness_1외 다른 페이지 */
	.Business_2 .BusinessFeature  {
		flex-direction: row;   
		flex-wrap: wrap;   /* 줄바꿈 허용 */
	}
	.Business_2 .FeatureBox {
		flex: 0 0 calc(50% - 50px);     /* 한 줄에 50%씩 차지 */
		max-width: calc(50% - 50px);    /* 최대 너비도 50% */
		box-sizing: border-box !important;
		flex-direction: column;
	}
	.Business_2 .FeatureBox h3.BoxTit {
		width: 100%;
	}
	
	.Business_3 .FeatureBox h3.BoxTit {
		width: 350px;	
	}
	

	.Business_3 .FeatureBox .BoxTxt p {
		font-weight: 400;
		color: #555;
		font-size: 18px;
		background: #f9f9f9; 
		padding: 10px 30px;
		border-radius: 20px;

	}

	@media (max-width: 768px) {
		.Business_2 .FeatureBox {
			flex: 0 0 100%;
			max-width: 100%;
		}
	}



.FeatureBox .BoxTxt {
	flex: 1; 
	font-size: 18px;
}
.FeatureBox .BoxTxt p {
	margin-bottom: 30px;
	font-size: 20px;
	font-weight: 600; 
}

/* 리스트 앞 컬러 원형 마커 */
.FeatureBox .BoxTxt> ul {
	display: flex; flex-direction: column; align-items: flex-start; gap: 10px;
}
.FeatureBox .BoxTxt> ul li { 
	display: flex; flex-direction: row; flex-wrap: wrap; align-items: center;
	font-size: 18px;
	font-weight: 300; 
}
.FeatureBox .BoxTxt> ul li::before {
	content: "";
	width: 6px;
	height: 6px;
	background: var(--color-accent);
	border-radius: 50%;
	margin-right: 5px;
}
.FeatureBox .BoxTxt ul li strong {
	position: relative; 
	margin-right: 15px;
	font-weight: 600; 
}
.FeatureBox .BoxTxt ul li strong::before { 
	content: "";
	position: absolute;
	bottom: 0;
    display: block;
    height: 11px;
    width: 100%;
    background-color: var(--color-accent);
    opacity: 0.3;
}
.FeatureBox .BoxTxt ul.EquipmentList {
	flex-direction: row;
    align-items: flex-start;
    flex-wrap: wrap;
}
.FeatureBox .BoxTxt ul.EquipmentList li {
  flex: 0 0 calc(33.3% - 10px);   /* 기본은 4등분 */
  	box-sizing: border-box;     /* padding/border 포함 계산 */

}

.FeatureBox .BoxTxt ul.EquipmentList li:last-child {
  flex: 1 1 auto;  /* 마지막은 남은 공간을 자동으로 채움 */
}
.FeatureBox .BoxTxt ul.EquipmentList li::before{display: none;}

	@media (max-width: 768px) {
		.FeatureBox .BoxTxt ul.EquipmentList li {
			flex: 0 0 calc(50% - 10px); /* 2등분 */
		}
	}

	@media (max-width: 480px) {
		.FeatureBox .BoxTxt ul.EquipmentList li {
			flex: 0 0 auto; /* 한 줄에 1개 */
		}
	}



.FeatureBox .BoxTxt > .txt2 {
	font-size: 16px;
}
.AttentionTxt {
	font-weight: 300;
}

	@media (max-width: 1024px) {
		.FeatureBox {flex-direction:column; gap: 10px;}
		.FeatureBox .BoxTxt {margin-left: 42px;}
	}

	@media (max-width: 425px) {
		.FeatureBox .BoxTxt {margin-left: 0;}
	}


/* 테이블 형태 */
.BoxTbl >* {
	display: grid; 
	grid-template-columns: repeat(3, 1fr);
	border-bottom: 1px solid var(--color-bg-gray);
	height: 40px;
	line-height: 40px;	
}
.BoxTbl {
	border-top: 1px solid var(--color-bg-dark);
	border-bottom: 1px solid var(--color-bg-dark);
}

.BoxTbl > div > div {padding-left: 30px;}
.BoxTbl .header { font-size: 14px; font-weight: 600;  color: var(--color-secondary); background-color: var(--color-bg-gray)}

.BoxTbl .bodyRow { font-size: 16px; font-weight: 400; color: var(--color-secondary)}
.BoxTbl .bodyRow .grade {font-weight: 600; color: var(--color-primary)}


/* 커피사업부 */
.Business_5 .BusinessFeature {
	width: 80%;
	margin: 0 auto;
	margin-top: 40px;
}
.Business_5 .FeatureBox {
	display: flex;
	flex-direction: row;
	gap: 50px;
}
.Business_5 .FeatureBox .BoxTxt {
	flex: 60%;
}
.Business_5 .FeatureBox .BoxTxt .txt1 {
	font-weight: 300;
}
.Business_5 .FeatureBox .BoxTxt strong.head {font-weight: 800;}
.Business_5 .FeatureBox .BoxTxt strong.head::before {display: none !important}
.Business_5 .FeatureBox .BoxTxt strong {position: relative}
.Business_5 .FeatureBox .BoxTxt strong::before {
	content: "";
	position: absolute;
	bottom: 0;
    display: inline-block;
    height: 11px;
    width: 100%;
    background-color: var(--color-accent);
    opacity: 0.3;
}
.Business_5 .FeatureBox .BoxImg {
	flex: 40%;
}

	@media (max-width: 1024px) {
		.Business_5 .BusinessFeature {
			width: 90%;
		}
		.Business_5 .FeatureBox .BoxTxt {
			margin-left:0;
		}
	}
	@media (max-width: 768px) {	
		.Business_5 .FeatureBox {
			flex-direction: column;
			gap: 20px;
		}
	}


/* 왜 티피와이인가? */
.BusinessAdvantages {
	margin-top: 90px;
	display: flex; flex-direction:column; align-items: center;
}
.AdvantTit {font-size: 48px; font-weight: 300; line-height: 1.2; text-align: center; margin-bottom:30px;}
.AdvantTit strong {font-weight: 700;}
.AdvantTit strong .accent {color: var(--color-accent)}
.AdvantList {
	width: 95%;
	margin:30px auto;
	display: grid; 
	grid-template-columns:repeat(auto-fit, minmax(160px, 1fr));
	align-items: center;  justify-items: center;	
}
.AdvantList li {  
	position: relative;
	display: flex; align-items: center; justify-content: center;
	width:15vw; height: 12vw; border-radius: 50px; 
	min-width:160px; min-height: 150px; 
	border: 1px solid var(--color-accent);
	font-size: 20px; font-weight: 600; color: #fff; background: var(--color-accent);
	text-align: center;
}
	@media (max-width: 768px) {
		.AdvantList {width: 100%; }
	}
	@media (max-width: 768px) {
		.AdvantList { gap: 5% 5%; }
	}


/* 품질관리 */


.QualityManage ul {
	display: grid;
	width: 900px;
    margin: 30px auto;
    grid-template-columns: 25% 25% 25% 25%; /* 한 줄에 4개 */
  	grid-template-rows: repeat(2, auto);   /* 2줄 */
    gap: 3% 0;
	align-items: center;
    justify-items: center

}
.QualityManage ul li {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 15vw;
    height: 15vw;
    border-radius: 50%;
    min-width: 250px;
    min-height: 250px;
	padding: 40px;
    border: 1px solid var(--color-accent);
    font-size: 22px;
    font-weight: 600;
    color: var(--color-accent);
    text-align: center;
}
	@media (max-width: 1024px) {
		.QualityManage ul {
			width: 70%; /* 한 줄에 3개 */
		}
		.QualityManage ul li {
			width: 12vw;
			height: 12vw;
			min-width: 200px;
			min-height: 200px;
		}
	}
	@media (max-width: 768px) {
		.QualityManage ul {
    		grid-template-columns: 33% 33% 33%;
			width: 70%; /* 한 줄에 3개 */
		}
	}
	@media (max-width: 425px) {
		.QualityManage ul {
			width: 100%; /* 한 줄에 3개 */
    		grid-template-columns: 50% 50%;
			gap: 0 -3% !important ;
		}

		.QualityManage ul li {
			width: 10vw;
			height: 10vw;
			min-width: 180px	;
			min-height: 180px;
			padding: 30px;
			font-size: 16px;
			font-weight: 600;
		}
	}






/* 보유설비 */

.Facilities ul {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 50px;
	width: 95%;
	margin:0 auto;
}
.Facilities ul li {
	flex: calc(33.3% - 50px);
	width: calc(33.3% - 50px);
	position:relative;
}
.Facilities ul li .img {
	border-top-right-radius: 80px;
	width: 100%; /* 기본 너비 */
	aspect-ratio: 400 / 427;   /* 비율 유지 */
	overflow: hidden;
	position: relative;
}
.Facilities ul li .img img {
	width: 100%;
	height: 100%;
	object-fit: cover;         /* 이미지가 박스를 꽉 채우도록 */
	object-position: center;   /* 가운데 기준으로 잘리게 */
}
.Facilities ul li .img::after {
	content: '';
	position: absolute;
	display: block;
	bottom:0;
	width: 100%;
	height: 150px;
	background-color: var(--color-accent-dark);
	opacity: 0.7;
}
.Facilities ul li .txt {
	position: absolute;
	display: block;
	bottom:0;
	display: flex;
	flex-direction: column;
	gap: 5px;
	width: 100%;
	height: 130px;
	padding-left: 30px;
	padding-right: 30px;
}
.Facilities ul li .txt .facilityTit,
.Facilities ul li .txt .facilityTxt  {
	color: #fff;
}
.Facilities ul li .txt .facilityTit {
	font-size: 24px; 
	font-weight: 800;
	flex: 0 0 auto;
}
.Facilities ul li .txt .facilityTxt {
	font-size: 16px; 
	font-weight: 400;
	flex: 0 0 auto;
}


	@media (max-width: 768px) {

		.Facilities ul {
			gap: 20px;
		}

		.Facilities ul li {
			flex: calc(50% - 20px);
			width: calc(50% - 20px);
		}

		
	}
	
	@media (max-width: 425px) {
		.Facilities ul {
			flex-direction: column;
			gap: 20px;
			width: 100%;
			margin:0 auto;
		}
		.Facilities ul li {
			flex: 100%;
			width: 100%;	
			position:relative;
			aspect-ratio: 400 / 427;   /* 비율 유지 */
		}
		.Facilities ul li .txt .facilityTxt .mbr {
			display: none;
		}
	}




/* privacy */
.checkbox.agree_radio {padding-top:10px !important;}
.agree_info { height:150px; padding:1%; background-color:#fff; border:1px #ddd solid; overflow:auto; }
.agree_info .con_bg_box { background-color:#f4f6f9; }


/********************************************************************************************************************************
 admin*/
 
/* login */
.access { margin:0; float:inherit; width:100%; }
.access .panel { border-radius:0; box-shadow: 0 0 50px rgba(0,0,0,.1); width:480px; margin:10% auto 15%; border: 0; }
.access .panel-heading { font-size:24px; font-weight: 600; background:none; text-align:center; padding: 50px 0 30px; border: 0;}
.access .panel-body { padding: 0; }
.access .panel-body form { width: 80%; margin: 0 auto 40px;}
.access .form-control { line-height: 60px; height: 60px; border-radius: 4px; border-color: #e5e5e5; padding: 0 15px; margin-bottom: 10px; }
.access .btn { margin: 0 0 10px 0; width: 100%; border-radius: 4px; font-size: 18px; line-height: 60px; }

@media (max-width: 425px) {
	.access .panel { width: 95%; margin: 10% auto 20%;}
	.access .panel-heading { font-size: 18px; padding: 20px 0 15px;}
	.access .panel-body form { width: 85%; margin: 0 auto 20px; }
	.access .form-control { line-height: 50px; height: 50px;}
}

/********************************************************************************************************************************
 mobile */

@media (max-width:1320px) {	
	.container, .main, .main_index .container, .main_con .container, .main_visual .container, .main_link.container,
	.MainCon .container, footer .container, .navbar_menu { width:100% !important; }		
}
@media (max-width:768px) {
	.bx-wrapper .bx-pager { bottom:20px; }	
}