@charset "UTF-8";

@font-face {
	font-family: "AritaDotumLight";
	font-style:normal;
	src: url('./fonts/AritaDotumLight.eot');
	src: local('☺'), url('./fonts/AritaDotumLight.woff') format('woff'), url('./fonts/AritaDotumLight.ttf') format('truetype');
}
@font-face {
	font-family: "AritaDotumMedium";
	font-style:normal;
	src: url('./fonts/AritaDotumMedium.eot');
	src: local('☺'), url('./fonts/AritaDotumMedium.woff') format('woff'), url('./fonts/AritaDotumMedium.ttf') format('truetype');
}
@font-face {
	font-family: "AritaDotumSemiBold";
	font-style:normal;
	src: url('./fonts/AritaDotumSemiBold.eot');
	src: local('☺'), url('./fonts/AritaDotumSemiBold.woff') format('woff'), url('./fonts/AritaDotumSemiBold.ttf') format('truetype');
}

body {
	margin:0;
	padding:0;
}
#wrapper {
	width:100%;
	max-width:1010px;
	margin:0 auto;
	/*마진을 0, 오토로 주면 해당 id가 화면 한 가운데로 정렬됨*/
/*포지션	을 렐러티브로 주고 자식테그에 포지션을 앱솔루트를 주고 탑에서의 거리를 top:0px 왼쪽이나 오른쪽 거리를 예를들어 right:10px 이렇게 주면 엄마위에 자식테그된 아이가 고정적으로 그 위치에 스크롤을 해도 그대로 있다.*/
	font-family:"AritaDotumMedium","아리따-돋움";
	}

#account {
	width:100%;
	max-width: 1010px;
	height:116px;
	position:fixed; top:0 !important;
	z-index:1000;
	color:white;
	}
#accountpink{
	background-color:#FF0099;
	float:left;
	width:100%;
	margin-right:-308px;
	height: 116px;
	font-size:23px;
	color:white;
	}
	.present {
		margin-right:308px;
		padding-left:30px;
	}
	#accountpink1 {
		font-size:20px;
	}
#sociallink {
	color: white;
	display: block;
	width:308px;
	height:116px;
	float:left;
	*zoom:1; }
	#sociallink:after {
		clear:both;
		content:' ';
		display:block;
	}
	#social {
		font-size:23px;
		background-color:#3399CC;
		width:100%;
		height:100%; }
		#social p {
			width: 105px;
			float: left;
			padding:20px 0 0 30px;
			margin:0;
		}
		#social p span {
			display:block;
			margin:0;
			padding:0;
		}
		#punch {
			float:right;
			padding-top:5px;
			padding-right:30px;
		}


#pinkbar {
	float:right;
	padding:0px;
}

/* 메인 헤드라인 */
#section1 {
	margin:116px 0 85px 0; 
	padding:170px 0 140px 0;
	text-align:center;
	position:relative;
}
#main_title {
	position:absolute;
	z-index:2;
	left:18%;
	top:50px;
}
#section1 p {
	margin:0;
	padding:0;
	color:black; }
	.mainblack {
		font-size:48px;
		text-align:left;
	}
	.mainpink {
		font-size:24px;
		color:#ff0099;
		text-align:left;
	}
#section1 img {
	width:339px;
}
#when {
	position:absolute;
	z-index:2;
	right:18%;
	bottom:0;
	text-align:right; }
	.when1 {
		font-size:2.5em;
		text-align:right;
	}
	.when2 {
		font-size:2.5em;
		text-align:right;
	}
	.when3 {
		font-size:2.5em;
		text-align:right;
	}

.epilogue {
	font-size:21px;
	text-align:justify;
	margin:0;
	padding:0;
}
.epilogue1 { 
	font-size:40px;
}
#section7 {
	background:url('./images/3section-1024.png') no-repeat center top;
	background-color:#666666;
	padding: 160px 7.3% 50px 11.2%;
}
.section7-1 {
	float:left;
	padding:0px 8.1% 50px 0px;
	width:29.8%;
	max-width:245px;
	min-width:200px;
}

#section7 .epilogue { color:white; }
#section7 .epilogue1 { color:white; }

#section7 iframe {
	max-width:800px;
}

#section8 {
	background: url('./images/3section-1024.png') no-repeat center top;
	padding: 160px 7.3% 50px 11.2%;
	margin: 0px 0px 100px 0px;
}
#section8 .epilogue { color:black; }
#section8 .epilogue1 { color:black; }

#history:link {
	color:#FF66CC;
}
#history:visited {
	color:#FF66CC;
}
#history:hover {
	color:#FF66CC;
}
#history {
	background-color:#3399CC;
	text-shadow: 1px 1px #CCFFFF;
	line-height: 30px;
	text-decoration:none;
}

#section9 {
	background: url('./images/3section-1024.png') no-repeat center top;
	background-color:#FF6633;
	padding: 120px 7.3% 50px 7.3%;
	*zoom:1; }
	#section9:after {
		clear:both;
		content:' ';
		display:block;
	}
	#section9 .epilogue { color: white; }
	#section9 .epilogue1 { color: white; }

#section10 {
	background: url('./images/3section-1024.png') no-repeat center top;
	padding: 160px 7.3% 50px 11.2%;
	}
	#section10 .epilogue { color: black; text-align: left; }
	#section10 .epilogue1 { color: black; }
	#section10 li { 
		font-size: 1.5em;
		text-align: right;
		text-shadow: 1px 1px #CCFFFF;
		list-style-type: none;
		}
		#section10 H5 { 
			font-size: 0.5em;
		}
#section10-1 {
	background:url('./images/bg_lyric.jpg') repeat center top;
	padding: 2% 7.3% 2% 11.2%;
	}
	#section10-1 P {
		text-align: center;
		text-shadow: 1px 1px #CCFFFF;
		line-height: 30px;
	}
#section10-2 {
	background:url('./images/logo_jnet.png') no-repeat center top;
	padding-top: 250px;
	margin-top: 60px;
}

#repeat {
	background: url('./images/repeat.png') repeat-x center top;
	opacity:0.5;
	background-size:50%;
	width:100%;
	height: 200px;
}
#repeat1 {
	color:black;
	font-size:40px;
	text-align:center;
	padding:120px 0px 0px 0px;
	margin:0px;
}

#repeat2 {
	background: url('./images/repeat1.png') repeat-x center bottom;
	background-size:1%;
	width:100%; height: 5px;
}
#opacity {
	opacity:0.5;
}

#section2 {
	background:url('./images/2section-1024.png') no-repeat center top;
	color:#333333;
	opacity:1;
}

#guideguide {
	text-align:right;
	padding: 242px 80px 140px 0px;
	background:url('./images/radius.png') no-repeat 380px 88px;
	margin:0px;
	color:#666666;
}

#guide1
	{

	font-size:40px;
	}
#guide2
	{
	font-size:30px;
	}
#guide3
	{
	font-size:23px;	
	}
#guide4
	{
	font-size:30px;
	}
#guide5
	{
	font-size:30px;
	}
.guidebasic {
	font-size:17px;
}
#section2picture {
	float:right;
}
#radial {
	background-color:#990066;
	width:304px;
	radius:25%;
	opacity:0.05;
	float:left;
}
#section3 {
	background:url('./images/3section-1024.png') no-repeat center top;
}
.party {
	margin:0px;
	font-size:21px;
	text-align:justify;
	padding: 206px 100px 100px 350px;
}	
.party1 {
	font-size:40px;
}
#daogiimg {
	float:left;
	padding:208px 50px 120px 139px;
}
#section4 {
	background:url('./images/4section-1024.png') no-repeat center top;
	padding:160px 74px 122px 114px;
}
#food {
	float:left;
	padding: 0 67px 100px 0px ;
}
#foodnews {
	margin:0px;
	font-size:21px;
	text-align:justify;
	padding: 0 20px 0 0px;
}
#foodnews1 {
	font-size:40px;
}

#section5 {
	background:url('./images/3section-1024.png') no-repeat center top;
	padding:0px:
	*zoom:1
	}
	#section5:after {
		clear:both;
		content:' ';
		display:block;
	}
#road {
	padding: 308px 78px 113px 55px;
	font-size:18px
	text-align:left;
	float:left;
	}
	
#road1 {
	font-size:48px;
	}
#namsangil {
	font-size:15px;
	}

#road2 {
	font-size:21px;
	}
#map {
	float:right;
	padding:221px 70px 108px 0;
	}
#footer {
	background-color:black;
	padding: 44px 95px 115px 95px;
	}
	#footer a {
		color:#fff;
	}
#information {
	text-align:center;
	color:white;
	font-size:21px;
	margin:0;
	padding:0;
}
#last {
	padding:210px 110px 118px 110px;
	background:url('./images/6section-1024.png') no-repeat center top;
	font-size:40px;
	color:black;
	text-align:center;
	}
	#lastlast span#donation {
		font-size:64px;
	}
	#lastlast span#namsan {
		font-size:56px;
	}
	
@media only screen and (max-width: 960px) {
	#wrapper {
		width:100%;
		margin:0;
		padding:0;
	}
	#account {
		width:100%;
	}
	#road {
		padding: 308px 48px 113px 55px;
	}
}

@media only screen and (max-width: 840px) {
	#guideguide
	{
		background:url('./images/radius.png') no-repeat 210px 88px;
	}
	#daogiimg {
		padding:208px 50px 120px 75px;
	}
	.party {
		padding: 206px 75px 100px 350px;
	}
	#section4 {
		padding:160px 75px 72px 75px;
	}
	#foodnews {
		padding:0;
	}
	#road {
		padding: 208px 30px 113px 55px;
	}
	#map {
		padding:151px 30px 108px 0;
	}
	#map iframe {
		width:340px !important;
	}
	#last {
		padding:178px 110px 118px 110px;
	}
}

@media only screen and (max-width: 768px) {
	.epilogue { font-size:18px; }
	.epilogue1 { font-size:32px; }
	#section7,
	#section8 {
		padding-top:120px;
		padding-bottom:40px;
		margin-bottom:60px;
	}
	#guideguide
	{
		background:url('./images/radius.png') no-repeat 170px 88px;
	}
	#foodnews1 {
		letter-spacing:-0.05em;
	}
	#road {
		padding: 208px 20px 113px 30px;
	}
	#map iframe {
		width:310px !important;
	}
	#last {
		padding:138px 110px 118px 110px;
	}
	#donation {
		display:block;
		margin:0;
		padding:0;
	}
}

@media only screen and (max-width: 720px) {
	#guideguide
	{
		background:url('./images/radius.png') no-repeat 90px 88px;
	}
	#daogiimg {
		padding:158px 50px 130px 55px;
	}
	.party {
		padding: 156px 55px 80px 55px;
	}
	#section4 {
		padding:160px 55px 51px 55px;
	}
	#food {
		padding: 0 55px 130px 0px;
	}
	#foodnews {
		padding: 0 0 0 0;
	}
	#road {
		padding: 158px 78px 30px 55px;
	}
	#map {
		padding:0 55px 60px 55px;
	}
	#map iframe {
		width:400px !important;
	}
	#last {
		padding:150px 110px 106px 110px;
	}
	#information span {
		display:block;
	}
}

@media only screen and (max-width: 600px) {
	#accountpink {
		margin-right:-258px; }
		.present {
			padding-left:20px;
			margin-right:258px; }
		#sociallink {
			width:258px; }
			#punch { padding-right:10px; }

	.mainblack {
		font-size:44px;
	}
	#guideguide {
		background:url('./images/radius.png') no-repeat 0 88px;
	}
	#daogiimg {
		padding:158px 30px 110px 30px;
	}
	.party {
		font-size:18px;
		padding: 156px 30px 80px 30px;
	}	
	.party1 {
		font-size:34px;
	}
	#section4 {
		padding:160px 30px 114px 30px;
	}
	#food {
		padding: 0 30px 100px 0px ;
	}
	#foodnews {
		font-size:18px;
		padding: 0 0 0 0px;
	}
	#foodnews1 {
		font-size:34px;
	}
	#road {
		padding: 158px 30px 30px 30px;
	}
	#map {
		padding:0 30px 60px 30px;
	}
	#last {
		padding:180px 90px 31px 90px;
	}
}

@media only screen and (max-width: 480px) {
	#account {
		width:100%;
		height:auto;
		padding:0;
	}
	#accountpink {
		text-align:center;
		height:auto;
		margin:0;
		padding:0; }
		.present {
			font-size:16px;
			letter-spacing:-0.05em;
			padding:4px 0;
			margin:0;
			}
			.present strong {
				font-size:12px;
				display:block;
				margin:0;
				padding:0;
			}
		#accountpink1 {
			font-size:14px;
		}
	#sociallink {
		width:100%;
		height:20px;
		}
		#social {
			margin:0;
			padding:4px 0;
			font-size:14px; }
			#social p {
				width:185px;
				padding:0 0 0 40px;
				}
				#social p span {
					display:inline;
					margin:0;
					padding:0 5px 0 0;
				}
			#punch {
				float:left;
				width:15px;
				padding:0;
				margin:0;
			}
	#section1 {
		padding:140px 0 80px 0;
		margin:40px 0;
	}
	.mainblack {
		font-size:28px;
	}
	#section1 img {
		width:80%;
		max-width:339px;
	}
	.when1 { font-size:20px; }
	.when2 { font-size:20px; }
	.when3 { font-size:20px; }
	#section7,
	#section8 {
		padding:90px 5px 30px 5px;
		margin-bottom:40px;
	}
	.center {
		text-align:center;
	}
	.section7-1 {
		float:none;
		padding:0;
	}
	.epilogue {
		font-size:14px;
		padding-left:20px;
		padding-right:20px;
	}
	.epilogue1 { font-size:20px; }
	#section9 {
		padding-top:100px;
		padding-left:5px;
		padding-right:5px;
	}
	#guideguide {
		padding: 80px 20px 80px 20px;
		background:url('./images/radius.png') no-repeat 0 0;
	}
	#daogiimg {
		width:200px;
		padding:100px 10px 10px 10px;
	}
	.party {
		font-size:14px;
		padding:100px 10px 10px 10px;
	}	
	.party1 {
		font-size:16px;
	}
	#section4 {
		padding:120px 10px 60px 10px;
	}
	#food {
		width:200px;
		padding: 0 10px 10px 0;
	}
	#foodnews {
		font-size:14px;
		padding: 0 10px 0 0;
	}
	#foodnews1 {
		font-size:16px;
	}
	#road {
		padding: 80px 10px 20px 10px;
		font-size:14px
		text-align:left;
		float:left;
	}
	#road1 {
		font-size:28px;
	}
	#road2 {
		font-size:18px;
	}
	#map {
		padding:0 10px 20px 10px;
	}
	#map iframe {
		width:460px !important;
	}
	#last {
		padding:100px 10px 60px 10px;
		font-size:20px;
	}	
	#lastlast span#donation {
		font-size:32px;
	}
	#lastlast span#namsan {
		font-size:30px;
	}
	#footer {
		background-color:black;
		padding: 40px 10px 40px 10px;
	}
	#information {
		font-size:14px;
	}
}

@media only screen and (max-width: 360px) {
	#daogiimg {
		width:150px;
	}
	.party {
		font-size:12px;
	}
	#food {
		width:150px;
	}
	#foodnews {
		font-size:12px;
	}
	#map iframe {
		width:340px !important;
	}
	#last {
		font-size:18px;
	}	
	#lastlast span#donation {
		font-size:26px;
	}
	#lastlast span#namsan {
		font-size:24px;
	}
}