@charset "utf-8";
/* CSS Document */

button.imgbtn > img{ display: block; } /*이미지만으로 만든 버튼*/
.bnblack { background:#000; color:#fff; display: inline-block; padding:5px; border:1px solid #000; border-radius: 5px; font-family: "Noto Sans KR"; }
.bnblack:hover { background: #fff; color:#000;}

.wd70{ box-sizing: border-box; width: 70px; }
.wd100{ box-sizing: border-box; width: 100px; }
.wd150{ box-sizing: border-box; width: 150px; }
.wd200{ box-sizing: border-box; width: 200px; }
.wd250{ box-sizing: border-box; width: 250px; }
.wd300{ box-sizing: border-box; width: 300px; }
.wd400{ box-sizing: border-box; width: 400px; }
.wd500{ box-sizing: border-box; width: 500px; }
.wd700{ box-sizing: border-box; width: 700px; }
.wd1080{ box-sizing: border-box; width: 1080px; }
.wd1200{ box-sizing: border-box; width: 1200px; }
.wd100pro{ box-sizing: border-box; width: 100%; }
.ht100{ box-sizing: border-box; min-height: 100px; overflow: auto; }

.bnS{
	cursor:pointer; font-size:95%; line-height:125%; font-weight:bold; display:inline-block; padding:5px 8px;
	border:1px solid #b1b1b1; border-radius:3px; color:#636363;
	background:#f1f1f1 linear-gradient(#ffffff, #e6e6e6);
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#e6e6e6));
	background:-moz-linear-gradient(top, #ffffff, #e6e6e6);
}
.bnM{
	cursor:pointer; font-size:95%; line-height:125%; font-weight:bold; display:inline-block; padding:10px 20px;
	border:1px solid #b1b1b1; border-radius:3px; color:#636363;
	background:#f1f1f1 linear-gradient(#ffffff, #e6e6e6);
	background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#e6e6e6));
	background:-moz-linear-gradient(top, #ffffff, #e6e6e6);
}
.bcblack { background:#000; color:#fff; border-color:#000; }
.bcblack:hover { background:#fff; color:#000; border-color:#b1b1b1; }
.bcblue1 { background:#414960; color:#fff; border-color:#414960; }
.bcblue1:hover { background:#fff; color:#414960; border-color:#b1b1b1; }
.bcblue2 { background:#5969f7; color:#fff; border-color:#5969f7; }
.bcblue2:hover { background:#fff; color:#5969f7; border-color:#5969f7; }
.bcgren1 { background:#39b54a; color:#fff; border-color:#39b54a; }
.bcgren1:hover { background:#fff; color:#39b54a; border-color:#39b54a; }
.vsbhd{ visibility: hidden;}
.dspx{ display: none;}
.bggray1{ background:#f7f7f7; }
.smallbar{ background: #000; color:#fff; line-height: 100%; display: inline-block; padding: 7px; border-radius: 3px; font-size: 90%; }
.stcss_a{ background:#5969f7 ; color: #fff; } /*regis 관련*/
.stcss_b{ background:#59B2F7 ; color: #fff; } /*regis 관련*/
.stcss_c{ background:#39b54a ; color: #fff; } /*regis 관련*/
.stcss_x{ background:#555 ; color: #fff; } /*regis 관련*/

.cutlength{ display: inline-block;max-width: calc(100% - 20px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 100%;  }

/*버튼*/
.btn-arrow {
    display:inline-block; position:relative; text-align:left; background: #fff; padding:8px 36px 8px 15px; min-width:90px; border:1px solid #ddd; z-index:5; overflow:hidden; 
    font-family: "Noto Sans KR"; font-weight: 500; font-size: 105%;
    transition:all 0.3s cubic-bezier(.57,.21,.69,1.25);
}
.btn-arrow:before{content:''; position:absolute; display:block; top:-1px; left:-120%; bottom:-1px; width:120%; background-color:#2b2b2b; transform-origin:0% -50%; transform:skewX(-20deg); transition:left 0.3s cubic-bezier(.57,.21,.69,1.25); z-index:-1}
.btn-arrow:after{content: '\2192';; position:absolute; right:13px; color:#999; transition:color 0.3s cubic-bezier(.57,.21,.69,1.25); z-index:1}
.btn-arrow:hover {color:#fff; border-color:#2b2b2b}
.btn-arrow:hover:before, .btn-arrow-black:hover:before {left:-2%}
.btn-arrow:hover:after {color:#fff}

/*txt 관련*/
.txtblur{ color:rgba(0,0,0,0.5)}
.boldblack{ color:#000; font-weight: bold; }
.boldblue{ color:#5969f7; font-weight: bold; }
.boldgreen{ color:#6DAB00; font-weight: bold; }
.tred1{ color:#ff000a; }
.tblue1{ color:#0083d9; }
.tgreen1{ color:#1fa500; }
.pd10px{ padding-left:10px; line-height: inherit; }
.ra{ display: inline-block; background: url(/images/arrow1.svg) no-repeat 0px 50%; padding-left:  30px; line-height: 35px;}

.idt_01{display: flex;}
.idt_01>span:first-child{ flex-shrink: 0;  width: 30px;}
.idt_01>span:last-child{ flex-grow:1; }

/*box 관련*/
/*.boxgray1{ border:1px solid #ddd; background: #f7f7f7; padding:20px; }*/
.rbox3px{ border-radius: 3px; padding:1px 8px; font-family: 'Noto Sans KR'; }
.graybox{ border:1px solid rgba(0,0,0,0.1); background: #f7f7f7; padding:15px; box-sizing: border-box; }
.grayrbox{ border:1px solid rgba(0,0,0,0.1); border-radius: 10px; background: #f7f7f7; padding:20px; box-sizing: border-box; }

.imgh1div{ overflow: auto; border-top:1px solid rgba(0,0,0,0.15); padding: 30px 0px; }
.imgh1div>img:first-child{ display: block; border:1px solid rgba(0,0,0,0.1); box-sizing: border-box; float: left; }
.imgh1div>h1{ color:#000; font-family: "Noto Sans KR"; font-size: 150%; font-weight: 500; padding: 0px 0px 20px 0px; overflow: auto; }
.imgh1div>div:last-child{ overflow: hidden; }

.h1div{ margin-bottom: 30px; }
.h1div>h1{ color:#000; font-family: "Noto Sans KR"; font-size: 140%; font-weight: 500; padding: 20px 0px; }

.LimgRdiv{ overflow: auto; border-top:1px solid rgba(0,0,0,0.15); padding: 30px 0px; }
.LimgRdiv>.limg{ display: block; float: left; font-family: "Noto Sans KR"; font-size: 150%; font-weight: 500; text-align: center; }
.LimgRdiv>.rdiv{ overflow: hidden; }

.flexrbox{ display: flex; flex-wrap: wrap; justify-content: space-between; }
.flexrbox>div{ border:1px solid #ddd; padding: 20px; border-top-left-radius: 30px; border-top-right-radius: 30px; box-sizing: border-box; }
.flexrbox>div>h1 { border-radius: 30px; padding: 10px 0px; margin-bottom: 10px; background: #ddd; color:#fff; font-family: "Noto Sans KR"; font-size: 100%; font-weight: 300; text-align: center;  }
.flexrbox>div>p { padding: 5px 0px; border-bottom: 1px dotted #e6e6e6; text-align: center }
.flexrbox>div>ul { margin-top: 10px; margin-bottom: 30px; }

.telZone{ margin-top: 30px; border-top: 1px dotted #ccc; display: flex; padding: 20px 0px; }
.telZone>div:first-of-type { 
    background: #D3D3D3; border-top-right-radius: 10px; border-bottom-left-radius: 10px; display: flex; width: 50px; height: 50px; flex-shrink: 0; 
    justify-content: center;align-items: center; color:#fff; margin-right: 10px;
}
.telZone>div:first-of-type>.material-icons{ font-size: 30px;}
.telZone>div:last-of-type>p{ color:#000; font-family: "Noto Sans KR"; font-size: 110%; }

.odrbox{ display: flex; flex-wrap: wrap; background: #555; padding: 20px; justify-content: center; border-top: 5px solid #1E1E1E; }
.odrbox>p{ padding:10px 15px; text-align: center; color:rgba(255, 255, 255, 0.8); font-family: "Noto Sans KR"; font-weight: 400; text-shadow: 01px 0px 5px rgba(0,0,0,0.7);  }
.odrbox>p>span{ display: inline-block; font-size: 40px; }
.odrbox>img{ width: 30px; flex-grow: 0; }

.icoh1step{ overflow: auto; }
.icoh1step>span:first-child{
	float: left; font-size: 40px; padding: 0px; background: rgba(0,0,0,0.15); width: 60px; height: 60px; text-align: center; margin-right: 20px;  border-radius: 40px;
	display: flex; justify-content: center; align-items: center;
}
.icoh1step>h1{ color:#000; font-family: "Noto Sans KR"; font-size: 140%; font-weight: 600; margin: 0px auto 10px auto; }
.icoh1step>h1>span{ color: rgba(0,0,0,0.5); display: inline-block; margin-right: 10px; }
.icoh1step>p{ overflow: hidden; }

.hideme{ opacity:0; margin-top:20px; }

/*table 관련*/
.topblueLine{ border-top:1px solid #6B809C; }
.trInformtag{ width: 100%; box-sizing: border-box; }
.trInformtag{ border-bottom: 1px solid #ccc;}
.trInformtag thead{ background: #f7f7f7; line-height: 38px;}
.trInformtag thead th{ border-right:1px solid #ccc; border-bottom: 1px solid #ccc;}
.trInformtag tbody{ line-height: 40px; text-align: center; }
.trInformtag tbody td{ border-right:1px solid #ddd; border-bottom: 0px solid #ddd; vertical-align: top;}
.trInformtag select, .trInformtag input{ 
    margin: 0px; border-radius: 0px; border: 0px; border-bottom: 1px solid #eee; background: transparent; 
    font-family: "Noto Sans KR"; font-size: 100%; font-weight: 400; margin: 0px 5px; width: calc(100% - 10px);
}
.trInformtag select{ 
    appearance: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; /* 네이티브 외형 감추기 */ 
    background:url("../../images/bottomarB2_ico.png") no-repeat calc(100% - 5px) 50%;
}
.trInformtag select::-ms-expand {display:none} /*ie 화살표 감추기*/
.trInformtag input:focus{ border-color: #1561CC; color:#1561CC}
.trInformtag textarea{ width:calc(100% - 10px);  margin: auto; height: 150px; border-radius: 0px; border-color: #ddd; }

.pd10tleft{ padding-left: 10px; text-align: left; }
.pd10tright{ padding-right: 10px; text-align: right; }
.pd10tleft td textarea{ margin-right: 10px;}

.boxtable1{ width: 100%; border:5px solid #f5f5f5; padding: 20px; }
.boxtable1 table{ width: 100%; line-height: 170% }
.boxtable1 td{ padding: 7px 10px; color:#777; }
.boxtable1 td:nth-child(2n+1){ background: #f7f7f7;}
.boxtable1 tr:not(:last-child)>td{ border-bottom: 1px dotted #eee;}

/*font-size*/
.md12{font-size: 12px;}
.md14{font-size: 14px;}
.md16{font-size: 16px;}
.md18{font-size: 18px;}

/*form 관련*/
.lineform select, .lineform input{
	margin: 0px; border-radius: 0px; border: 0px; border-bottom: 1px solid #eee; background: transparent; 
    font-family: "Noto Sans KR"; font-size: 100%; font-weight: 400; margin: 0px 5px; 
}
.lineform select{ 
    appearance: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; /* 네이티브 외형 감추기 */ 
    background:url("../../images/bottomarB2_ico.png") no-repeat calc(100% - 5px) 50%; padding-right: 30px;
}
.lineform select::-ms-expand {display:none} /*ie 화살표 감추기*/
.lineform input:focus{ border-color: #1561CC; color:#1561CC}
.smtzone{ padding:10px 0px; text-align: right; }

.inputfile>input[type=file]{ width: 0px; display: none; }
input.fileSearch, #mainConts input.fileSearch{ background: url(../images/search_btn.png) no-repeat 100% 50%;}
/*
.inputfile{ position:relative;z-index:auto;display:inline-block; vertical-align:top; top:0px; width:66px;height:28px;overflow:hidden; }
.inputfile >button:first-child{position:absolute;left:0px;top:0px;z-index:auto;}
.inputfile >input[type=file]{
	width:72px;height:27px;display:inline-block;position:absolute;top:0px;left:-6px;z-index:auto;
	margin-left:0px; opacity:0; -moz-opacity:0; cursor:pointer;
}
*/

/*자바스크립트 동적 카렌더 관련*/
.cldspan{ display:inline-block;position:relative }
.cldspan>div { position:absolute; z-index:auto; top:-20px; left:-162px; overflow:visible }
.calendartb{ 
	margin-top:-1px; padding:2px 10px 10px 10px;text-align:center; width: 250px;
	background:#fff;border:1px solid #bbb;border-bottom-left-radius: 10px;border-bottom-right-radius:10px; box-shadow: 1px 1px 3px rgba(0,0,0,0.5);
}
.calendartb table{ width: 100%; line-height: 200%; }
.calendartb table td, .calendartb table th{ border: 1px solid #ddd;}
.calendartb table th{ background: #f7f7f7;}
.calendartb .sunday{ color:#FF1E00; }
.calendartb .saturday{ color:#0051ff; }
.calendartb .cldxbn{ position:absolute; z-index:auto; top:10px; right: 10px; width: 12px; height: 12px; background: url(/images/mobile_icoListX.svg);}

/*html 카렌더 관련*/
.calendar { table-layout: fixed; }
.calendar th { border-bottom:1px solid #ccc;border:1px solid #ccc;color:#000;vertical-align:middle;background:#f7f7f7; line-height: 200%; }
.calendar tr:last-child>th:first-child, .calendar tr:last-child>th:last-child{background:#f0f1f9;color:#5969f7}
.calendar tr>td:first-child:not(.dateon), .calendar tr>td:last-child:not(.dateon){background:#f0f1f9;}

.dateWrap{ margin:1px auto;text-align:center;border-bottom:1px dotted #ccc; box-sizing: border-box; }
a#txtAll { position:absolute; z-index:auto; display:block; top:0px; left:0px; background:#6c819d; color:#fff; padding:0px 5px; }
.ston { font-size:11px;color:#005b7f;font-weight:bold;}
.stoff {font-size:11px;color:#f26522;font-weight:bold;}
.cldstrcut{ display: inline-block; max-width: calc(100% - 27px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }

/*list page 관련*/
.listSelect{ padding : 10px; font-family:"Malgun Gothic","Myriad Pro","Dotum","Tahoma"; }
.listSelect>button{ margin-right: 2px;}
.listSelect>p{ float:right; text-align: right; }
#pagezone{ text-align: center; font-family:"Malgun Gothic","Myriad Pro","Dotum","Tahoma"; padding: 10px 0px;}
#pagezone>a,#pagezone>span{ display: inline-block; padding: 5px;}
#pagezone>#pgFirst{ display: inline-block; width: 12px; height: 12px; background: url("/images/page/arrowDL.svg") no-repeat 0px center; padding: 0px; margin-right: 5px;}
#pagezone>#pgFirst:hover{ background-image: url("/images/page/arrowDLc.svg"); }
#pagezone>#pgLast{ display: inline-block; width: 12px; height: 12px; background: url("/images/page/arrowDR.svg") no-repeat 0px center; padding: 0px; margin-left: 5px;}
#pagezone>#pgLast:hover{ background-image: url("/images/page/arrowDRc.svg"); }
#pagezone .prvoff{ display: inline-block; padding:0px 15px; background: url("/images/page/arrowL.svg") no-repeat 0% center;font-size: 90%; }
#pagezone .nexoff{ display: inline-block; padding:0px 15px; background: url("/images/page/arrowR.svg") no-repeat 100% center;font-size: 90%; }
#pagezone .prvon{ display: inline-block; padding:0px 15px; background: url("/images/page/arrowLc.svg") no-repeat 0% center;font-size: 90%; }
#pagezone .nexon{ display: inline-block; padding:0px 15px; background: url("/images/page/arrowRc.svg") no-repeat 100% center;font-size: 90%; }

/*프린트 관련*/
#print_lay{ border-top:2px solid #6b809c; }
#print_lay>table{ width: 100%;}
#print_lay>table>thead{ background: #f7f7f7; line-height: 38px;}
#print_lay>table th, #print_lay>table td { border:1px solid #ddd; }
#print_lay>table tr:first-child>th { border-top:0px; }
#print_lay>table>tbody{ line-height: 39px; text-align: center; color:#555 }

/*PC 관련*/
@media screen and (min-width: 501px) {
    .mobile{ display: none;}
	.do500{ display: none;}

	/* 탭 */
	.tab { display: flex; box-sizing: border-box; background: url(/images/dot1px.svg) repeat-x 0% 100%;  }
	.tab>a{ 
		display: inline-block; background: #F9F9F9; padding: 5px 0px; border-left:1px solid #ddd; border-top:1px solid #ddd; border-bottom:1px solid #ddd;
		font-family: "Noto Sans KR"; font-size: 100%; font-weight: 400; text-align: center;
	}
	.tab>a:last-child{ border-right: 1px solid #ddd;}
	.tab>a:first-child{ margin-left: 10px;}
	.tab>a.tabon{ background: #fff; border-bottom-color: #fff; border-top:2px solid #7BC100; color:#000; font-weight: 500;}

    /*box 관련*/
    .leftinc{ float: left; text-align: center;}

	.imgh1div>img:first-child{ margin-right: 30px; width: calc(30%);  }
	.LimgRdiv>.limg{ width: calc(20%); }
	.odrbox{ border-bottom-left-radius: 100px; border-top-right-radius: 100px;	}

	.calendar td{height:110px; color:#555; font-size: 90%; line-height:18px; border:1px solid #ccc ; vertical-align:top !important; text-align:left; padding:5px;}
}
/*탭 이하 관련*/
@media screen and (max-width: 1024px) {
    .mobileX{ display: none; }
	.mobile{ display: initial;}

	#pagezone .numbn{ 
        width: 20px; line-height: 20px; border:1px solid #ccc; border-radius: 3px; margin:0px 1px; font-family: "Lusitana"; 
        background:#f1f1f1 linear-gradient(#ffffff, #f1f1f1);
        background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#f1f1f1));
        background:-moz-linear-gradient(top, #ffffff, #f1f1f1);
    }

	#viewPro{ display: none; border:2px solid #000; border-radius: 5px; padding: 10px; margin-bottom: 10px; }
	#viewPro>h1{ font-family: "Noto Sans KR"; font-size: 120%; font-weight: 500; border-bottom: 1px solid #ddd; padding: 5px; }
	#viewPro>p { padding: 5px; }
	#viewPro>p:not(:last-child){ border-bottom: 1px dotted #ddd; }
	#viewPro .ston { background:#005b7f; color:#fff; font-weight:bold; font-size: 90%; display: inline-block; padding: 3px 5px; border-radius: 2px; line-height: 120%; margin-right: 10px; }
	#viewPro .stoff { background:#f26522; color:#fff; font-weight:bold; font-size: 90%; display: inline-block; padding: 3px 5px; border-radius: 2px; line-height: 120%; margin-right: 10px;}

	.calendar td{color:#555;  border:1px solid #ccc ;  padding:5px; text-align: center; }
	.calendar td.dateon{ background: #D8F0B8; }
	.oncday+div{ display: none;}

}
/*모바일 이하 관련*/
@media screen and (max-width: 500px) {
	.dx500{ display: none; }

	/* 탭 */
	.tab { 
		display: flex; flex-wrap: wrap; 
		box-sizing: border-box; margin-bottom: 20px; padding: 0px 10px;
		font-family: "Noto Sans KR"; border-bottom:1px solid #ccc;
	}
	.tab>a{ flex-basis:25%; box-sizing: border-box; padding:5px; background: #f7f7f7; outline: 1px solid #ccc; text-align: center; }
	.tab>a.tabon{ color:#000; font-weight: 500; background: #fff; border-top: 1px solid #7BC100; }
	
	/*box 관련*/
	.imgh1div{ padding: 15px 0px; }
	.imgh1div>img:first-child{ width: 100%; float:initial; margin-bottom: 20px;  }

	.LimgRdiv>.limg{ float: initial; }
	.odrbox{ border-radius: 10px;	}
}