@CHARSET "UTF-8";

@import url(common.css);



#Wrap					{ position: relative; float: left; min-width: 100%; }
#Wrap .container		{ position: relative; width: 1100px; margin: 0 auto; }
#Wrap .container1		{ position: relative; width: 1199px; margin: 0 auto; }
#Wrap .container2		{ position: relative; width: 100%; height: 59px; margin: 0 auto; background: #003055; opacity: 0.7; filter: alpha(opacity=70); -moz-opacity: 0.7; -khtml-opacity: 0.7; }

#billboard				{ position: absolute; left: 0; top: 150px; width: 100%; height: 636px; text-align: center; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
.Mainbg					{ position: absolute; left: 0; top: 0; width: 100%; z-index: -1; }
.Mainbg .imgbox1		{ position: absolute; left: 0; top: 0; width: 100%; height: 636px; background: url(../img/main/img_main_bgTop01.jpg) center top no-repeat; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
.Mainbg .imgbox2		{ position: absolute; left: 0; top: 0; width: 100%; height: 636px; background: url(../img/main/img_main_bgTop02.jpg) center top no-repeat; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
.Mainbg .imgbox3		{ position: absolute; left: 0; top: 0; width: 100%; height: 636px; background: url(../img/main/img_main_bgTop03.jpg) center top no-repeat; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
.Mainbg .imgbox4		{ position: absolute; left: 0; top: 0; width: 100%; height: 636px; background: url(../img/main/img_main_bgTop04.jpg) center top no-repeat; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
.Mainbg .imgbox5		{ position: absolute; left: 0; top: 0; width: 100%; height: 636px; background: url(../img/main/img_main_bgTop05.jpg) center top no-repeat; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }

/*
#billboard .btn_arrow .left			{ z-index: 99; position: absolute; left: 80px; top: 210px; }
#billboard .btn_arrow .right		{ z-index: 99; position: absolute; right: 80px; top: 210px; }
#billboard .btn_arrow button		{ width: 80px; height: 78px; font-weight: 800; font-size: 30px; color: #f5f5f5; background: #a3a3a3; opacity: 0.5; filter: alpha(opacity=50); -moz-opacity: 0.5; -khtml-opacity: 0.5; }
#billboard .btn_arrow button:hover	{ width: 80px; height: 78px; font-weight: 800; font-size: 30px; color: #fff; background: #b4b4b4; border: 1px solid #939393; opacity: 0.7; filter: alpha(opacity=70); -moz-opacity: 0.7; -khtml-opacity: 0.7; }
*/

#billboard .mainNotice							{ z-index: 10; margin: 0 auto; margin-top: 577px; width: 100%; }
#billboard .mainNotice li						{ float: left; width: 470px; height: 59px; text-align: center; font-size: 15px; line-height: 4.1; background: #2a1b04; opacity: 0.7; filter: alpha(opacity=70); -moz-opacity: 0.7; -khtml-opacity: 0.7; }
#billboard .mainNotice li:first-child			{ width: 198px; color: #fff; background: #000000; font-weight: 700; font-size: 20px; line-height: 3.2; opacity: 0.8; filter: alpha(opacity=80); -moz-opacity: 0.8; -khtml-opacity: 0.8; }
#billboard .mainNotice li:last-child			{ width: 60px; background: #3583b9; }
#billboard .mainNotice li:last-child a			{ color: #fff; font-size: 40px; font-weight: 700; line-height: 1.4; }
#billboard .mainNotice li:last-child a:hover	{ color: #000; }
#billboard .mainNotice li a						{ color: #fff; }
#billboard .mainNotice li a:hover				{ color: #ebca12; }
#billboard .mainNotice li span					{ margin-left: 15px; color: #fff; font-size: 11px; font-weight: 100; }

.section1								{ position: relative; float: left; margin-top: 770px; width: 100%; height: 690px; }
.section1 .products						{ position: relative; float: left; margin-top: 60px; width: 100%; }
.section1 .products h3					{ height: 70px; font-size: 40px; color: #3c323b; text-align: center; font-weight: 700; letter-spacing: 0; }
.section1 .products h3 span				{ display: block; padding-bottom: 10px; font-size: 16px; font-weight: 500; }
.section1 .products ul					{ margin: 0 auto; margin-top: 50px; width: 100%; }
.section1 .products li					{ float: left; width: 50%; height: 220px; font-size: 18px; font-weight: 700; text-align: center; }
.section1 .products li:nth-child(1)		{ background: url(../img/main/icon_main01.png) left top no-repeat; }
.section1 .products li:nth-child(2)		{ background: url(../img/main/icon_main02.png) left top no-repeat; }
.section1 .products li:nth-child(3)		{ background: url(../img/main/icon_main03.png) right top no-repeat; }
.section1 .products li:nth-child(3) div	{ margin: 35px 0 0 0; }
.section1 .products li:nth-child(4)		{ padding-top: 10px; background: url(../img/main/icon_main04.png) right top no-repeat; }
.section1 .products li:nth-child(4) div	{ margin: 25px 0 0 0; padding-bottom: 15px; }
.section1 .products li div				{ margin: 35px 0 0 300px; padding-bottom: 40px; width: 50%; background: url(../img/main/bar_icon.png) center bottom no-repeat; }
.section1 .products li span				{ display: block; float: left; width: 100%; margin-top: 10px; color: #989898; font-size: 13px; font-weight: 500; }
.section1 .products li a				{ color: #3c323b; }
.section1 .products li a:hover			{ color: #77933d; }

.section2									{ position: relative; float: left; width: 100%; height: 650px; background: #ededed; }
.section2 .introduce						{ position: relative; float: left; width: 100%; }
.section2 .introduce ul						{ margin: 0 auto; margin-top: 20px; width: 100%; height: 558px; text-align: center; }
.section2 .introduce li						{ float: left; font-size: 20px; font-weight: 700; }
.section2 .introduce li:nth-child(1)		{ width: 412px; height: 558px; color: #ffffff; background: url(../img/main/icon_main06.png) center 125px no-repeat; }
.section2 .introduce li:nth-child(2)		{ width: 375px; height: 558px; color: #333333; background: url(../img/main/icon_main05.png) center top no-repeat; }
.section2 .introduce li:nth-child(3)		{ width: 412px; height: 558px; color: #ffffff; background: url(../img/main/icon_main07.png) center 125px no-repeat; }
.section2 .introduce li span				{ display: block; margin-top: 410px; width: 100%; }
.section2 .introduce li p					{ margin: 0 auto; padding-top: 10px; width: 310px; color: #6d6d6d; font-size: 13px; font-weight: 300; line-height: 1.3; }
.section2 .introduce li a					{ display: inline-block; margin-top: 20px; padding: 8px 15px 10px 15px; width: auto; color: #ffffff; font-size: 13px; font-weight: 400; letter-spacing: 1px; background: #a4ae88; }
.section2 .introduce li a:hover				{ background: #98a279; }


/* 스마트폰 가로 세로 글씨(폰트) 크기 바뀌지 않게 */
* { -webkit-text-size-adjust: none; }


@media screen and (max-width: 800px) {
	#Wrap .container		{ width: 100%; margin: 0 auto; }
	#Wrap .container1		{ width: 100%; margin: 0 auto; }
	#Wrap .container2		{ height: 37px; background: none; }

	#billboard					{ top: 50px; height: 326px; border-bottom: 1px solid #DCEDF3; background: url(../img/main/img_main_bgTop01.jpg) center no-repeat; background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
	#billboard .container .fix	{ position: fixed; top: -238px; opacity: 1; filter: alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; }
	#billboard .Mainbg			{ display: none; }
	#billboard .btn_arrow		{ display: none; }

	#billboard .icon_mainA					{ margin: 37px 0 0 0; width: 360px; }
	#billboard .icon_mainA li				{ margin: 0 20px 20px 0; width: 100px; height: 100px; }
	#billboard .icon_mainA li:nth-child(1)	{ background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
	#billboard .icon_mainA li:nth-child(2)	{ background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
	#billboard .icon_mainA li:nth-child(3)	{ background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
	#billboard .icon_mainA li:nth-child(4)	{ background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
	#billboard .icon_mainA li:nth-child(5)	{ background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
	#billboard .icon_mainA li:nth-child(6)	{ background-size: cover; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; }
	#billboard .icon_mainA li a				{ margin-top: 39px; font-weight: 700; }

	#billboard .mainNotice							{ margin-top: 290px; width: 100%; }
	#billboard .mainNotice li						{ float: left; width: 75%; height: 37px; font-size: 13px; line-height: 2.9; }
	#billboard .mainNotice li:first-child			{ width: 18%; font-size: 14px; line-height: 2.5; font-weight: 500; }
	#billboard .mainNotice li:nth-child(3)			{ display: none; }
	#billboard .mainNotice li:last-child			{ width: 7%; }
	#billboard .mainNotice li:last-child a			{ font-size: 30px; line-height: 1.2; }
	#billboard .mainNotice li span					{ margin-left: 30px; }

	.section1								{ margin-top: 376px; height: 360px; }
	.section1 .introduce					{ margin-top: 30px; }
	.section1 .introduce h3					{ height: 34px; font-size: 30px; background: none; }
	.section1 .introduce ul					{ margin-top: 20px; width: 570px; }
	.section1 .introduce li					{ width: 170px; height: 170px; font-size: 22px; font-weight: 700; text-align: center; }
	.section1 .introduce li:nth-child(2)	{ margin: 0 30px; }
	.section1 .introduce li img				{ width: 170px; }

	.section2								{ height: 254px; }
	.section2 .products						{ margin-top: 30px; width: 100%; }
	.section2 .products h3					{ font-size: 30px; }
	.section2 .products dl					{ margin-top: 10px; }
	.section2 .products dd:nth-child(2)		{ margin-top: 20px; }

	.section3								{ height: 463px; background: url(../img/main/img_main_bgBottom.jpg) center -30px no-repeat; }
	.section3 ul							{ margin: 0 auto; margin-top: 65px; width: 97%; }
	.section3 ul li:nth-child(1)			{ width: 36%; height: auto; background: url(../img/main/min_logo02.png) left top no-repeat; }
	.section3 ul li:nth-child(2)			{ width: 63%; height: 155px; background-size: 30% 70%; -webkit-background-size: 30% 70%; -moz-background-size: 30% 70%; -o-background-size: 30% 70%; margin-bottom: 40px; }
	.section3 ul li:nth-child(3)			{ width: 63%; height: 155px; background-size: 30% 70%; -webkit-background-size: 30% 70%; -moz-background-size: 30% 70%; -o-background-size: 30% 70%; }

	.section3 ul li:nth-child(1) dl			{ width: 85%; }
	.section3 ul li:nth-child(1) dt			{ margin-top: 30px; font-size: 47px; line-height: 43px; }
	.section3 ul li:nth-child(1) dd			{ margin-top: 30px; text-align: justify; }
	
	.section3 ul li:nth-child(2) dl			{ width: 65%; }
	.section3 ul li:nth-child(3) dl			{ width: 65%; }

	.section3 ul li:nth-child(2) dl dt		{ font-size: 20px; }
	.section3 ul li:nth-child(2) dl dd		{ margin-top: 10px; text-align: justify; }
	.section3 ul li:nth-child(2) dl dd a	{ margin-top: 10px; }

	.section3 ul li:nth-child(3) dl dt		{ font-size: 20px; }
	.section3 ul li:nth-child(3) dl dd		{ margin-top: 10px; text-align: justify; }
	.section3 ul li:nth-child(3) dl dd a	{ margin-top: 10px; }

}

@media screen and (max-width: 650px) {


}

@media screen and (max-width: 400px) {
	#billboard					{ height: 206px; }
	#billboard .container .fix	{ position: fixed; top: -120px; opacity: 1; filter: alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; }

	#billboard .icon_mainA					{ margin: 20px 0 0 0; width: 210px; }
	#billboard .icon_mainA li				{ margin: 0 5px 10px 0; width: 62px; height: 62px; }
	#billboard .icon_mainA li a				{ margin-top: 20px; padding: 0 3px 3px 3px; font-weight: 500; font-size: 10px; letter-spacing: -1px; }

	#billboard .mainNotice							{ margin-top: 170px; }
	#billboard .mainNotice li						{ font-size: 12px; line-height: 3; }
	#billboard .mainNotice li:first-child			{ width: 16%; }
	#billboard .mainNotice li:last-child			{ width: 9%; }
	#billboard .mainNotice li span					{ display: none; }

	.section1								{ margin-top: 257px; height: 225px; }
	.section1 .introduce					{ margin-top: 20px; }
	.section1 .introduce h3					{ height: 25px; font-size: 23px; }
	.section1 .introduce ul					{ margin-top: 10px; width: 88%; }
	.section1 .introduce li					{ width: 100px; height: 100px; font-size: 18px; }
	.section1 .introduce li:nth-child(2)	{ margin: 0 15px; }
	.section1 .introduce li img				{ margin-bottom: 10px; width: 100px; }
	.section1 .introduce li span			{ margin-top: 5px; font-size: 11px; letter-spacing: -1px; }

	.section2								{ height: 224px; }
	.section2 .products						{ margin-top: 20px; }
	.section2 .products h3					{ font-size: 23px; }
	.section2 .products dl					{ margin-top: 7px; width: 90%; }
	.section2 .products dt					{ font-size: 14px; }
	.section2 .products dd:nth-child(2)		{ margin-top: 15px; font-size: 12px; line-height: 17px; }
	.section2 .products dd:nth-child(3)		{ margin-top: 20px; }

	.section3 ul							{ margin-top: 45px; width: 96%; }
	.section3 ul li:nth-child(1)			{ display: none; }
	.section3 ul li:nth-child(2)			{ width: 100%; margin-bottom: 60px; }
	.section3 ul li:nth-child(3)			{ width: 100%; }

	.section3 ul li:nth-child(2) dl dt		{ font-size: 18px; }
	.section3 ul li:nth-child(3) dl dt		{ font-size: 18px; }

	.section3 ul li:nth-child(2) dl dd		{ line-height: 1.3; }
	.section3 ul li:nth-child(3) dl dd		{ line-height: 1.3; }


}


@media screen and (max-width: 320px) {
	#billboard					{ height: 180px; }
	#billboard .container .fix	{ position: fixed; top: -99px; opacity: 1; filter: alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; }

	#billboard .icon_mainA					{ margin: 20px 0 0 0; width: 185px; }
	#billboard .icon_mainA li				{ width: 55px; height: 55px; }
	#billboard .icon_mainA li a				{ margin-top: 18px; }

	#billboard .mainNotice							{ margin-top: 151px; }
	#billboard .mainNotice li						{ font-size: 11px; line-height: 2.9; height: 30px;}
	#billboard .mainNotice li:first-child			{ font-size: 12px; }
	#billboard .mainNotice li:last-child a			{ font-size: 25px; }

	.section1								{ margin-top: 231px; height: 210px; }
	.section1 .introduce li					{ width: 83px; height: 83px; font-size: 17px; }
	.section1 .introduce li:nth-child(2)	{ margin: 0 16px; }
	.section1 .introduce li img				{ width: 83px; }
	.section1 .introduce li span			{ font-size: 10px; letter-spacing: 0; }

	.section3 ul							{ margin-top: 35px; }

}