﻿




	.container{
		justify-content: center;	
		margin:0 0 0 0;
		}
	
	.header{
		}
	
	.main{
		}
		
	.main_a{
		padding: 20 10 10 10;
		}
		
	.main_a1{
		padding: 0 0 10 0;
		}
	
	.main_b{
		padding: 20 10 10 10;
		}
		
	.main_b1{
		padding: 0 0 10 0;
		border-radius: 10px;
		background-color: #EEEEEE;		
		}		
		
	.sub{
		}
		
	.sub_a{
		padding: 10 20 10 20;
		}
		
	.sub_a1{
		padding: 0 0 10 0;
		}
	
	.sub_b{
		padding: 10 10 10 10;
		}
		
	.sub_b1{
		padding: 0 10 10 10; 
		border-radius: 10px;
		background-color: #EEEEEE;		
		}	
	.sub_b2{
		padding: 0 10 10 0;
		}			
		
		
	.favorites{
		display: inline-block; 
		padding: 6px 16px; 
		margin: 0 5 10 5;
		border: solid 1px #666666;
		background: #FFFFFF; 
		border-radius: 33px; 
		font-weight: bold; 
		font-size: 15px; 
		letter-spacing:-1px; 
		line-height: 100%; 
		color: #0d0d0d;
		}			
		
	.sido{
		display: inline-block; 
		padding: 5px 13px; 
		margin: 0 0 0 0;
		border: solid 1px #666666;
		background: #FFFFFF; 
		border-radius: 25px; 
		font-weight: bold; 
		font-size: 14px; 
		letter-spacing:-1px; 
		line-height: 100%; 
		color: #0d0d0d;
		}					
					
					
	.div_blank{
		height: 10px;
		}
	
	.footer{
		clear:both; 
		/* https://www.youtube.com/watch?v=Zny5Vxqk6Mk --- FOOTER 관련 유튜브*/
		text-align: center;
		vertical-align:middle;
		background-color: #EEEEEE;
		padding: 5 0 5 0;
		}
	
	
	.header_title{ 
		display: flex; 
		/* none : 보이지 않음 */
		/* block : 블록 박스 */
		/* inline : 인라인 박스 */
		/* inline-block : block과 inline의 중간 형태 */
		padding: 10 10 10 10;
		
		justify-content: space-between;
		/* justify-content: flex-end; */
		/* justify-content: center; */
		/* justify-content: space-between; */
		/* justify-content: space-around; */
		/* justify-content: space-evenly; */
		align-mains: center;
		}
		
	.banner1{
		display:none;
		}
		
	.logo{
		}
		
	.banner2{
		}		

	.header_menu{
		clear:both;
 
		/* none : 보이지 않음 */
		/* block : 블록 박스 */
		/* inline : 인라인 박스 */
		/* inline-block : block과 inline의 중간 형태 */
			 
		
		justify-content: space-between;
		/* justify-content: flex-end; */
		/* justify-content: center; */
		/* justify-content: space-between; */
		/* justify-content: space-around; */
		/* justify-content: space-evenly; */
		align-mains: center;
		border-top: solid 1px #000;
		border-bottom: solid 1px #000;
		}
		
	.nav_menu{
		display: flex; 
		justify-content: space-between; 
		text-align:justify; 
		padding:5 5 5 5;
		}
		
	.menu{ 
		}	

	.imgbanner{
		width: 170px;
		}	
		
	.imgcontents{
		width: 95%;
		}
	
	/* 유튜브 크기... 비율 변경  */	
	/*  
	iframe{ 
		position: absolute; top:0; left:0; width: 100%; height: 100%;
		}		
		
	.player{
		padding-top: 56.25%; position: relative; 	
		}
	 */	
		
	@media screen and (min-width: 600px) { /* 화면이 600 보다 커지면 (태블릿 화면인 경우) */
		.main{
			display: flex; 
			}
			
		.main_a{
			width: 55%;
			}
	
		.main_b{
			width: 45%;	
			}
						

		.sub{
			display: flex; 
			}
			
		.sub_a{
			width: 55%;
			}
	
		.sub_b{
			width: 45%;	
			}
			
			
			
		.banner1{
			display:block;
			}
			
		.imgbanner{
			width: 250px;
			}	
		.header_title{ 
			padding: 20 10 20 10;

			}			
		
		}




	BODY	{
	scrollbar-face-color: #cccccc; 
	scrollbar-shadow-color: #ffffff; 
	scrollbar-highlight-color: #ffffff; 
	scrollbar-3dlight-color: #cccccc;
	scrollbar-darkshadow-color: #cccccc;
	scrollbar-track-color: #ffffff;
	scrollbar-arrow-color: #ffffff;
	}

    td 	{ 
		font-size: 14px; 	
		color: #4C4C4C; 
		FONT-FAMILY: Malgun Gothic; 
		text-decoration: none; 
		Line-Height: 130%; }   
	
	/* 주석 처리 */ 

	.contents10 	{ FONT-FAMILY: Malgun Gothic; font-size: 10px; Line-Height: 130%;}  
	.contents11 	{ FONT-FAMILY: Malgun Gothic; font-size: 11px; Line-Height: 130%;}  
	.contents12 	{ FONT-FAMILY: Malgun Gothic; font-size: 12px; Line-Height: 130%;}  
	.contents13 	{ FONT-FAMILY: Malgun Gothic; font-size: 13px; Line-Height: 130%;}
	.contents14 	{ FONT-FAMILY: Malgun Gothic; font-size: 14px; Line-Height: 130%;}
	.contents15 	{ FONT-FAMILY: Malgun Gothic; font-size: 15px; Line-Height: 130%;}	
	.contents16 	{ FONT-FAMILY: Malgun Gothic; font-size: 16px; Line-Height: 150%; color: black;}  
	.contents17 	{ FONT-FAMILY: Malgun Gothic; font-size: 17px; Line-Height: 150%; color: black;}  	
	.contents18 	{ FONT-FAMILY: Malgun Gothic; font-size: 18px; Line-Height: 130%;}  
	.contents18w 	{ FONT-FAMILY: Malgun Gothic; font-size: 18px; Line-Height: 130%; color:#999999;}  	
	.contents20 	{ FONT-FAMILY: Malgun Gothic; font-size: 20px; Line-Height: 130%; letter-spacing:-1px;}  	
	.contents24 	{ FONT-FAMILY: Malgun Gothic; font-size: 24px; Line-Height: 130%; letter-spacing:-1px;} 
	.contents28 	{ FONT-FAMILY: Malgun Gothic; font-size: 28px; Line-Height: 130%; letter-spacing:-1px;} 
	.contents32 	{ FONT-FAMILY: Malgun Gothic; font-size: 30px; Line-Height: 130%;} 
	.contents36 	{ FONT-FAMILY: Malgun Gothic; font-size: 36px; Line-Height: 130%;} 	
	.contents40 	{ FONT-FAMILY: Malgun Gothic; font-size: 40px; Line-Height: 130%;} 	
	.contents48 	{ FONT-FAMILY: Malgun Gothic; font-size: 48px; Line-Height: 130%;} 	
	.contents60 	{ FONT-FAMILY: Malgun Gothic; font-size: 60px; Line-Height: 130%;} 	

	/* 첫번째 글자만 크기를 지정할 경우-------------------------------------------  */ 	
	/* 참고자료 : https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements            --------  */      
	/* first-letter, first-line, marker, placeholder, ----------------------------------------------------  */ 	

	.contents10::first-letter {
		font-size: 20px;
	} 
	.contents10::first-line {
		font-color: red;
	}

	/* ------------------------------------------------------------------------------  */ 	
	
	select::-ms-expand { display: none; } /*  IE 10, 11의 네이티브 화살표 숨기기 */ 
	select{    
		height: 22px;
		padding:0px 20px 0px 5px;
		margin: 0px 0px 0px 0px;
		border:1px solid #666666;
		FONT-FAMILY: Malgun Gothic; 
		font-size: 14px; 
		color:#FF0000;
		letter-spacing: 0px; 
		background:#fcffcb url(/images/select_box_01.jpg) no-repeat right top; /* 네이티브 화살표 대체 */ 
		-webkit-border-radius:0;
		-webkit-appearance:none;
		-moz-appearance: none; 
		appearance: none;
		}

	input[type=text] { 
		padding: 2px 5px 2px 5px; 
		margin: 2px 0px 2px 0px;
		FONT-FAMILY: Malgun Gothic; 
		font-size:14px; 
		color:#0d0d0d;
		height:20px; 	
		background-color:#FFFFFF;
		border:1px solid #666666; 	 
		}
	input[type=text][readonly] {
		padding: 2px 5px 2px 5px; 
		margin: 2px 0px 2px 0px;
		FONT-FAMILY: Malgun Gothic; 
		font-size:14px; 
		color:#0d0d0d;
		height:20px; 	
		background-color:#EEEEEE;
		border:1px solid #666666;
		}		
		
	input[type=image] { 
		padding: 0 0 0 0;	 
		}		

	/* ------------------------------------------------------------------------------  */ 	
	/* 사용 예 : <input type="text" placeholder="이곳에 입력하세요~" disabled>    */ 	
	input:focus { 
		color: deeppink;
		background-color:#EEEEEE;
		}	
	input:readonly	 {
		color: black; 
		background-color: #EEEEEE;
		}
	input:disabled { 
		color: black; 
		background-color: lightyellow; 
		}		
	input::placeholder { 
		font-size:14px;
		color: lightgray; 
	}
	input.readonlyinput	{
		color: black; 
		background-color: #EEEEEE; 
	}
	/* ------------------------------------------------------------------------------  */ 
	
	
	/* ------------------------------------------------------------------------------  */ 	
	/* #special { color: pink }                                                          */ 	
	/* id="special"                                                                        */ 	
	/* ------------------------------------------------------------------------------  */ 	



	input.radio	{
		FONT-FAMILY: Malgun Gothic; 
		font-size:14px; 
		color:#0d0d0d;
		background-color:#00FF00;
		border:1 solid;
		border-color:#D3D3D3;
		border-style:solid; 
		height:14px; 
		}

	input.radioButton	{
		FONT-FAMILY: Malgun Gothic; 
		font-size:14px; 
		color:#0d0d0d;
		background-color:#FFFFFF;
		border:1 solid;
		border-color:#D3D3D3;
		border-style:solid; 
		height:14px; 
		}

	textarea 	{  
		/*  height:300px;
		width:200px;   */ 
		padding-left: 5px; padding-right: 5px; padding-top: 1px; padding-bottom: 2px; 
		FONT-FAMILY: Malgun Gothic; 
		font-size:14px; 
		color:#666666;
		background-color:#FFFFFF;
		border:1 solid;
		border-color:#999999;
		}
		
	textarea[type=text] {
		height:70px;
		width: 80%;
		padding: 2 5 2 5;	 
		}	
		
	textarea:focus { 
		color: deeppink;
		background-color:#EEEEEE;
		}			
	textarea::placeholder { 
		font-size:14px;
		color: lightgray; 
		}
	.noBoxtextarea {
		FONT-FAMILY: Malgun Gothic; 
		border:0 solid;
		background-color:#FFFFFF;
		}		

    a:link    	{ FONT-FAMILY: Malgun Gothic;font-size:14px; text-decoration:none; color:#0d0d0d} 
    a:visited 	{ FONT-FAMILY: Malgun Gothic;font-size:14px; text-decoration:none; color:#666666}
    a:active  	{ FONT-FAMILY: Malgun Gothic;font-size:14px; text-decoration:none; color:#0d0d0d}
    a:hover  	{ FONT-FAMILY: Malgun Gothic;font-size:14px; text-decoration:none; color:#FF8c2f;  text-decoration:underline;} 
	 
	.menuTitle:link		{ FONT-FAMILY: Malgun Gothic; font-size:18px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;} 
   	.menuTitle:visited 	{ FONT-FAMILY: Malgun Gothic; font-size:18px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;}
	.menuTitle:active 	{ FONT-FAMILY: Malgun Gothic; font-size:18px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;}
   	.menuTitle:hover 	{ FONT-FAMILY: Malgun Gothic; font-size:18px; text-decoration:none; color:#FF0000; letter-spacing:-1px; Line-Height: 130%;}	 	

	.linkTitle10:link 		{ FONT-FAMILY: Malgun Gothic; font-size:10px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;} 
   	.linkTitle10:visited 	{ FONT-FAMILY: Malgun Gothic; font-size:10px; text-decoration:none; color:#666666; letter-spacing:-1px; Line-Height: 130%;}
	.linkTitle10:active 	{ FONT-FAMILY: Malgun Gothic; font-size:10px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%;}
   	.linkTitle1:hover		{ FONT-FAMILY: Malgun Gothic; font-size:10px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%; text-decoration:underline; }		
		
	.linkTitle11:link 		{ FONT-FAMILY: Malgun Gothic; font-size:11px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;} 
   	.linkTitle11:visited 	{ FONT-FAMILY: Malgun Gothic; font-size:11px; text-decoration:none; color:#666666; letter-spacing:-1px; Line-Height: 130%;}
	.linkTitle11:active 	{ FONT-FAMILY: Malgun Gothic; font-size:11px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%;}
   	.linkTitle11:hover		{ FONT-FAMILY: Malgun Gothic; font-size:11px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%; text-decoration:underline; }				

	.linkTitle12:link 		{ FONT-FAMILY: Malgun Gothic; font-size:12px; text-decoration:none; color:#0d0d0d; letter-spacing:0px; Line-Height: 130%;} 
   	.linkTitle12:visited 	{ FONT-FAMILY: Malgun Gothic; font-size:12px; text-decoration:none; color:#666666; letter-spacing:0px; Line-Height: 130%;}
	.linkTitle12:active 	{ FONT-FAMILY: Malgun Gothic; font-size:12px; text-decoration:none; color:#333333; letter-spacing:0px; Line-Height: 130%;}
   	.linkTitle12:hover		{ FONT-FAMILY: Malgun Gothic; font-size:12px; text-decoration:none; color:#333333; letter-spacing:0px; Line-Height: 130%; text-decoration:underline; }		
		
	.linkTitle13:link 		{ FONT-FAMILY: Malgun Gothic; font-size:13px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;} 
   	.linkTitle13:visited  	{ FONT-FAMILY: Malgun Gothic; font-size:13px; text-decoration:none; color:#666666; letter-spacing:-1px; Line-Height: 130%;}
	.linkTitle13:active 	{ FONT-FAMILY: Malgun Gothic; font-size:13px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%;}
   	.linkTitle13:hover		{ FONT-FAMILY: Malgun Gothic; font-size:13px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%; text-decoration:underline; }				
				
	.linkTitle14:link 		{ FONT-FAMILY: Malgun Gothic; font-size:14px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;} 
   	.linkTitle14:visited 	{ FONT-FAMILY: Malgun Gothic; font-size:14px; text-decoration:none; color:#666666; letter-spacing:-1px; Line-Height: 130%;}
	.linkTitle14:active 	{ FONT-FAMILY: Malgun Gothic; font-size:14px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%;}
   	.linkTitle14:hover		{ FONT-FAMILY: Malgun Gothic; font-size:14px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%; text-decoration:underline; }		
	
	.linkTitle15:link 		{ FONT-FAMILY: Malgun Gothic; font-size:15px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;} 
   	.linkTitle15:visited 	{ FONT-FAMILY: Malgun Gothic; font-size:15px; text-decoration:none; color:#666666; letter-spacing:-1px; Line-Height: 130%;}
	.linkTitle15:active 	{ FONT-FAMILY: Malgun Gothic; font-size:15px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%;}
   	.linkTitle15:hover		{ FONT-FAMILY: Malgun Gothic; font-size:15px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%; text-decoration:underline; }			
		
	.linkTitle16:link 		{ FONT-FAMILY: Malgun Gothic; font-size:16px; text-decoration:none; color:#0d0d0d; letter-spacing:0px; Line-Height: 130%;} 
   	.linkTitle16:visited 	{ FONT-FAMILY: Malgun Gothic; font-size:16px; text-decoration:none; color:#666666; letter-spacing:0px; Line-Height: 130%;}
	.linkTitle16:active 	{ FONT-FAMILY: Malgun Gothic; font-size:16px; text-decoration:none; color:#333333; letter-spacing:0px; Line-Height: 130%;}
   	.linkTitle16:hover		{ FONT-FAMILY: Malgun Gothic; font-size:16px; text-decoration:none; color:#333333; letter-spacing:0px; Line-Height: 130%; text-decoration:underline; }			
		
	.linkTitle18:link 		{ FONT-FAMILY: Malgun Gothic; font-size:18px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;} 
   	.linkTitle18:visited 	{ FONT-FAMILY: Malgun Gothic; font-size:18px; text-decoration:none; color:#666666; letter-spacing:-1px; Line-Height: 130%;}
	.linkTitle18:active 	{ FONT-FAMILY: Malgun Gothic; font-size:18px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%;}
   	.linkTitle18:hover		{ FONT-FAMILY: Malgun Gothic; font-size:18px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%; text-decoration:underline; }		
	
	.linkTitle20:link 		{ FONT-FAMILY: Malgun Gothic; font-size:20px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;} 
   	.linkTitle20:visited 	{ FONT-FAMILY: Malgun Gothic; font-size:20px; text-decoration:none; color:#666666; letter-spacing:-1px; Line-Height: 130%;}
	.linkTitle20:active 	{ FONT-FAMILY: Malgun Gothic; font-size:20px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%;}
   	.linkTitle20:hover		{ FONT-FAMILY: Malgun Gothic; font-size:20px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%; text-decoration:underline; }	

	.linkTitle24:link 		{ FONT-FAMILY: Malgun Gothic; font-size:24px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;} 
   	.linkTitle24:visited 	{ FONT-FAMILY: Malgun Gothic; font-size:24px; text-decoration:none; color:#666666; letter-spacing:-1px; Line-Height: 130%;}
	.linkTitle24:active 	{ FONT-FAMILY: Malgun Gothic; font-size:24px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%;}
   	.linkTitle24:hover		{ FONT-FAMILY: Malgun Gothic; font-size:24px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%; text-decoration:underline; }	
		
	.linkTitle28:link 		{ FONT-FAMILY: Batang, Malgun Gothic; font-size:28px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;} 
   	.linkTitle28:visited 	{ FONT-FAMILY: Batang, Malgun Gothic; font-size:28px; text-decoration:none; color:#666666; letter-spacing:-1px; Line-Height: 130%;}
	.linkTitle28:active 	{ FONT-FAMILY: Batang, Malgun Gothic; font-size:28px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%;}
   	.linkTitle28:hover		{ FONT-FAMILY: Batang, Malgun Gothic; font-size:28px; text-decoration:none; color:#FF0000; letter-spacing:-1px; Line-Height: 130%; text-decoration:underline; }			
		
	.linkTitle32:link 		{ FONT-FAMILY: Batang, Malgun Gothic; font-size:32px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;} 
   	.linkTitle32:visited 	{ FONT-FAMILY: Batang, Malgun Gothic; font-size:32px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%;}
	.linkTitle32:active 	{ FONT-FAMILY: Batang, Malgun Gothic; font-size:32px; text-decoration:none; color:#333333; letter-spacing:-1px; Line-Height: 130%;}
   	.linkTitle32:hover		{ FONT-FAMILY: Batang, Malgun Gothic; font-size:32px; text-decoration:none; color:#FF0000; letter-spacing:-1px; Line-Height: 130%; text-decoration:underline; }				
		
	.linkTitle36:link 		{ FONT-FAMILY: Malgun Gothic; font-size:36px; text-decoration:none; color:#0d0d0d; letter-spacing:-1px; Line-Height: 130%;} 
	.linkTitle36:visited 	{ FONT-FAMILY: Malgun Gothic; font-size:36px; text-decoration:none; color:#666666; letter-spacing:-1px; Line-Height: 130%;}
	.linkTitle36:active 	{ FONT-FAMILY: Malgun Gothic; font-size:36px; text-decoration:none; color:#666666; letter-spacing:-1px; Line-Height: 130%;}
   	.linkTitle36:hover		{ FONT-FAMILY: Malgun Gothic; font-size:36px; text-decoration:none; color:#FF0000; letter-spacing:-1px; Line-Height: 130%; text-decoration:underline; } 


	/* ------------------------------------------------------------------------------  */ 
	/* 사용 예 : <input type="button" value="확인">    */ 	 
	
	[type="button"] {
		width: 100px, heught:30px;
		background-color: tomato; color: white;
		border: none; border-radius: 10px;
	}
	[type="button"]:hover{
		background-color: gray;
	}
	}
	[type="button"]:active{
		background-color: black;
	}	
	/* ------------------------------------------------------------------------------  */ 
	