/* Reset CSS */
* { margin:0; padding:0; box-sizing:border-box; }
ol, ul { list-style:none; }
h1, .h1 { font-size: 3rem; font-weight: 500; }
h2, .h2 { font-size: 2.5rem; font-weight: 500; }
h3, .h3 { font-size: 2.0rem; font-weight: 500; }
h4, .h4 { font-size: 1.5rem; font-weight: 500; }
h5, .h5 { font-size: 1.2rem; font-weight: 500; }
h6, .h6 { font-size: 1rem ; font-weight: 500; }
strong { font-weight:500; }

/* Basic Style */
html { font-size:16px; }
body { font-size:1rem; font-family:'Inter', 'Noto Sans Korean Hestia', sans-serif; font-weight:300; color:#494949; }


/* Basic Layout */
#header { display:block; position:fixed; z-index:7000; top:0; left:0; width:100%; background:#fff; }
	#header .header-out { /* padding-top:20px; */ border-bottom:1px solid #eee; background: #fff; }
	#header .header-in { width:1200px; margin:0 auto; background:#fff; display:flex; justify-content:space-between; align-items:center; height:70px; }
	
	#header .header-screen { position: absolute; top:71px; left:0; width:100%; height:0px; background:#fff; z-index:-1; transition:.25s ease-in-out; }
	#header .header-screen.active { height:300px; }

	#btn-mobile { display: none; overflow:hidden; }
	#btn-mobile-open { position: relative; display: block; border:0; background:#706f50; background:none; width:34px; height:34px; }
	#btn-mobile-open span { display:block; position: absolute; left:0; width:100%; height:4px; background:#bf1e2e; border-radius:5px; opacity:1; transition:.25s ease-in-out; }
	#btn-mobile-open span:nth-child(1) { top:3px; transform:rotate(0deg); }
	#btn-mobile-open span:nth-child(2) { top:15px; }
	#btn-mobile-open span:nth-child(3) { top:27px; transform:rotate(0deg); }

	#jang-logo { display: block; width:400px; /*height:70px*/; background:#fff; margin-right:20px; margin-top:10px }
	#jang-logo .img1 { margin-bottom:10px; }
	#jang-gnb { display:flex; justify-content:space-between; align-items:center; flex-grow:2; margin-top:10px; }

	.jang-menu1 { display:flex; justify-content:flex-start; }
	.jang-menu1 > li { position: relative; }
	.jang-menu1 > li > a { font-size:1.25rem; font-weight:400; letter-spacing: -1px; color:#222; height:60px; display:flex; align-items:center; justify-content:center; padding:0 10px; margin:0 10px; text-align: center; min-width:100px; z-index:2; }
	.jang-menu1 > li > a:hover { color:#8f4141; }

	.jang-menu1 .sub { display: block; height:0; overflow: hidden; position: absolute; top:60px; left:0; width:100%; background:transparent; transition:all .35s ease-in-out; padding-top:20px; z-index:1; opacity:0; }
	.jang-menu1 .sub.active { /* top:60px; */ height:240px; opacity:1; }
	.jang-menu1 > li:hover {/* color:#bf1e2e; */}
	.jang-menu1 > li:hover .sub { /* height:244px; */ }
	.jang-menu1 .sub li { text-align: center; }
	.jang-menu1 .sub li:last-child { border-bottom:0; }
	.jang-menu1 .sub a { display: block; color:#222; font-size:16px; line-height: 24px; padding:5px 5px; }
	.jang-menu1 .sub a:hover { font-weight: 400; color:#8f4141; }

/*
	.jang-menu1 li.list--1:hover .sub { height:248px; }
	.jang-menu1 li.list--2:hover .sub { height:108px; }
	.jang-menu1 li.list--3:hover .sub { height:108px; }
	.jang-menu1 li.list--4:hover .sub { height:38px; }
	.jang-menu1 li.list--5:hover .sub { height:108px; }
	.jang-menu1 li.list--6:hover .sub { height:38px; }
*/

	.jang-menu2 { display:flex; justify-content:flex-end; }
	.jang-menu2 li { margin-right:10px; }
	.jang-menu2 li:last-child { margin-right:0px; }
	.jang-menu2 a { font-size:14px; line-height: 18px; color:#595959; }

	#header.open #jang-gnb { left:60vw; }

	#header.open #btn-mobile-open span:nth-child(1) { top:15px; left:-2px; transform:rotate(135deg); width:110%; }
	#header.open #btn-mobile-open span:nth-child(2) { left:-100px; opacity:0; }
	#header.open #btn-mobile-open span:nth-child(3) { top:15px; left:-2px; transform:rotate(-135deg); width:110%; }

	#header.open .jang-menu1 { display:block; }
	#header.open .jang-menu1 .sub { position: relative; display:none; height:auto; top:auto; left:auto; width:100%; opacity:1; padding-top:0;  }
	#header.open .jang-menu1 .sub li {  }
	#header.open .jang-menu1 .sub a { padding-left: 30px; color:#222; text-align:left; }
	#header.open .jang-menu1 .sub.on { display:block; }


/* 본문 영역 */
/* 고정형 #header와 겹치지 않기 위해 #wrapper에 상단 padding을 준다. */
#wrapper { padding-top:71px; padding-bottom:60px; width:1200px; margin:0 auto; }
	#wrapper::after { display:block; clear:both; content:''; }
	#container { width:100%; }
	#container h2.page-title {font-size:1.75rem; font-weight:400; padding:40px 0 20px; border-bottom:1px solid #222; margin-bottom:30px; color:#222;}

	#wrapper.is-sub { width:100%; }

	#banner-sub .inner { height:310px; display:flex; align-items:center; justify-content:center; }
	#banner-sub .inner .text .title { font-size:56px; font-weight:600; font-family:'Nanum Myeongjo', serif; color: #fff; text-align:center; margin-bottom: 5%; text-shadow:1px 2px 3px rgba(20, 20, 20, 1); }
	#banner-sub .inner .text .desc { font-size: 24px; color: #fff; letter-spacing: -1px; text-shadow:1px 1px 2px rgba(50, 50, 50, 1); }


	#wrapper.is-sub #left { width:1200px; margin:0 auto; height:60px; transform:translateY(-50%); }


	#wrapper.is-sub #container { width:1200px; margin:0 auto; min-height:600px; }

	#left .group-title { font-weight:400; font-size:1.625rem; line-height:5; text-align:center; color:#fff; background:#bf1e2e; }
	#left .group-list { display:flex; justify-content:center; }
	#left .group-list li { flex:1; margin-right:2px; margin-left:2px; border:1px solid #924A11; }
	#left .group-list li a { display:block; font-size: 20px; line-height:3; padding:0 20px; color:#fff; background:#924A11; text-align: center;}
	#left .group-list li.on {}
	#left .group-list li.on a { font-weight:450; color:#924A11; background:#fff; }


	.fix_btn { right:40px; bottom:100px; }

/***************************
Common Css
***************************/

/* decoration */
.underline { text-decoration:underline; }
.under { text-decoration:underline; }

/* text */
.bold { font-weight:500; }

/* color */
.aliceblue { color:aliceblue; }
.antiquewhite { color:antiquewhite; }
.aqua { color:aqua; }
.aquamarine { color:aquamarine; }
.azure { color:azure; }
.beige { color:beige; }
.bisque { color:bisque; }
.black { color:black; }
.blanchedalmond { color:blanchedalmond; }
.blue { color:blue; }
.blueviolet { color:blueviolet; }
.brown { color:brown; }
.burlywood { color:burlywood; }
.cadetblue { color:cadetblue; }
.chartreuse { color:chartreuse; }
.chocolate { color:chocolate; }
.coral { color:coral; }
.cornflowerblue { color:cornflowerblue; }
.cornsilk { color:cornsilk; }
.crimson { color:crimson; }
.cyan { color:cyan; }
.darkblue { color:darkblue; }
.darkcyan { color:darkcyan; }
.darkgoldenrod { color:darkgoldenrod; }
.darkgray { color:darkgray; }
.darkgreen { color:darkgreen; }
.darkkhaki { color:darkkhaki; }
.darkmagenta { color:darkmagenta; }
.darkolivegreen { color:darkolivegreen; }
.darkorange { color:darkorange; }
.darkorchid { color:darkorchid; }
.darkred { color:darkred; }
.darksalmon { color:darksalmon; }
.darkseagreen { color:darkseagreen; }
.darkslateblue { color:darkslateblue; }
.darkslategray { color:darkslategray; }
.darkturquoise { color:darkturquoise; }
.darkviolet { color:darkviolet; }
.deeppink { color:deeppink; }
.deepskyblue { color:deepskyblue; }
.dimgray { color:dimgray; }
.dodgerblue { color:dodgerblue; }
.firebrick { color:firebrick; }
.floralwhite { color:floralwhite; }
.forestgreen { color:forestgreen; }
.fuchsia { color:fuchsia; }
.gainsboro { color:gainsboro; }
.ghostwhite { color:ghostwhite; }
.gold { color:gold; }
.goldenrod { color:goldenrod; }
.gray { color:gray; }
.green { color:green; }
.greenyellow { color:greenyellow; }
.honeydew { color:honeydew; }
.hotpink { color:hotpink; }
.indianred { color:indianred; }
.indigo { color:indigo; }
.ivory { color:ivory; }
.khaki { color:khaki; }
.lavender { color:lavender; }
.lavenderblush { color:lavenderblush; }
.lawngreen { color:lawngreen; }
.lemonchiffon { color:lemonchiffon; }
.lightblue { color:lightblue; }
.lightcoral { color:lightcoral; }
.lightcyan { color:lightcyan; }
.lightgoldenrodyellow { color:lightgoldenrodyellow; }
.lightgray { color:lightgray; }
.lightgreen { color:lightgreen; }
.lightpink { color:lightpink; }
.lightsalmon { color:lightsalmon; }
.lightseagreen { color:lightseagreen; }
.lightskyblue { color:lightskyblue; }
.lightslategray { color:lightslategray; }
.lightsteelblue { color:lightsteelblue; }
.lightyellow { color:lightyellow; }
.lime { color:lime; }
.limegreen { color:limegreen; }
.linen { color:linen; }
.magenta { color:magenta; }
.maroon { color:maroon; }
.mediumaquamarine { color:mediumaquamarine; }
.mediumblue { color:mediumblue; }
.mediumorchid { color:mediumorchid; }
.mediumpurple { color:mediumpurple; }
.mediumseagreen { color:mediumseagreen; }
.mediumslateblue { color:mediumslateblue; }
.mediumspringgreen { color:mediumspringgreen; }
.mediumturquoise { color:mediumturquoise; }
.mediumvioletred { color:mediumvioletred; }
.midnightblue { color:midnightblue; }
.mintcream { color:mintcream; }
.mistyrose { color:mistyrose; }
.moccasin { color:moccasin; }
.navajowhite { color:navajowhite; }
.navy { color:navy; }
.oldlace { color:oldlace; }
.olive { color:olive; }
.olivedrab { color:olivedrab; }
.orange { color:orange; }
.orangered { color:orangered; }
.orchid { color:orchid; }
.palegoldenrod { color:palegoldenrod; }
.palegreen { color:palegreen; }
.paleturquoise { color:paleturquoise; }
.palevioletred { color:palevioletred; }
.papayawhip { color:papayawhip; }
.peachpuff { color:peachpuff; }
.peru { color:peru; }
.pink { color:pink; }
.plum { color:plum; }
.powderblue { color:powderblue; }
.purple { color:purple; }
.red { color:red; }
.rosybrown { color:rosybrown; }
.royalblue { color:royalblue; }
.saddlebrown { color:saddlebrown; }
.salmon { color:salmon; }
.sandybrown { color:sandybrown; }
.seagreen { color:seagreen; }
.seashell { color:seashell; }
.sienna { color:sienna; }
.silver { color:silver; }
.skyblue { color:skyblue; }
.slateblue { color:slateblue; }
.slategray { color:slategray; }
.snow { color:snow; }
.springgreen { color:springgreen; }
.steelblue { color:steelblue; }
.tan { color:tan; }
.teal { color:teal; }
.thistle { color:thistle; }
.tomato { color:tomato; }
.turquoise { color:turquoise; }
.violet { color:violet; }
.wheat { color:wheat; }
.white { color:white; }
.whitesmoke { color:whitesmoke; }
.yellow { color:yellow; }
.yellowgreen { color:yellowgreen; }



/* Background Color */

.bg-green { background:#008b00; color:#ffffff; }
.bg-red { background:#cd3333; color:#ffffff; }
.bg-blue { background:#4156c5; color:#ffffff; }
.bg-orange { background:#d2691e; color:#ffffff; }
.bg-sky { background:deepskyblue; color:#ffffff; }
.bg-gray { background:#cccccc; color:#000000; }