@charset "utf-8";

.m{display:block;}

#hd {background:none; position:fixed; top:0; width:100%; z-index:10}
#hd #hd_wrapper {padding:3% 4.6%; position:relative;}
#hd #hd_wrapper.on {background: rgba(0,0,0,0.7)}
#hd #logo {text-align:left; width:70%;padding:0; height:auto}
#hd #logo a {display:inline-block; width:40%; margin-right:5%;}
#hd #logo a:last-child{margin-right:0; width:45%;}
#hd #logo img {width:100%; height:auto; }
#hd #ham {position:absolute; top:50%; width:16.56%; left:auto; right:0%; height:auto; padding:5% 0; margin-top:-8%; background:none; border:0; text-align:center;}
#hd #ham img {width:50%;}


.wrap img {width:100%;}

.wrap .scroll {position:fixed; bottom:5%; right:5%; width:18.125%; }
.wrap .scroll img { width:100%; max-width:100px; }
.wrap .scroll.hi {display:none;}

.wrap #db_wrap {background: #1a1a1a url(../img/m/7_bg.jpg) no-repeat 0% 100%; text-align:center; background-size:100% auto; padding-bottom:12%;}
.wrap #db_wrap .map {margin-bottom:20px;}
.wrap #db_wrap .map iframe {width:90%; height:150px;}
.wrap #db_wrap .formmail {width:90%; margin:0 auto; background:#fff; padding:5% 2%;}
.wrap #db_wrap dl {display:table; width:100%; text-align:left; margin-bottom:15px}
.wrap #db_wrap dt {display:table-cell; width:80px;  color:#000; vertical-align:top; font-size:17px}
.wrap #db_wrap dd {display:table-cell; }
.wrap #db_wrap dd input[type="text"] {width:95%; height:33px; border:1px solid #ddd; text-indent:3px;}
.wrap #db_wrap dd.tel input[type="text"] {width:30%; margin-left:6px;}
.wrap #db_wrap dd.tel select {width:30%; height:33px; border:1px solid #ddd; text-indent:3px; background:#fff;}
.wrap #db_wrap dd textarea{height:80px; width:95%;     border: 1px solid #ddd;}
.wrap #db_wrap .agree {color:#000; font-size:13px; margin-bottom:20px;}
.wrap #db_wrap .agree a {color:#000;}
.wrap #db_wrap .bt button {border:0; width:80%;}

.wrap #sc07 .sc{width:90%; margin:0 auto;}


#side_wrap {position:fixed; top:0; left:auto; right:0; bottom:0; background: #222; width:80%; display:none;}
#side_wrap #gnb_close {position: absolute; top: 0; left: 0px; width: 12%;background: #222; z-index: 100; text-indent: 0;}
#side_wrap #gnb_close img {width:100%;}
#side_wrap ul {padding:20% 9% 0;}
#side_wrap ul li {margin-bottom:6%;}
#side_wrap ul li a {display:inline-block; font-size:7vw; color:#fff; }
#side_wrap ul + a {display:inline-block; font-size:7vw; color:#fff; margin:0 9% }

.tel_btn{display:none !important;}

.sc_foot_m{background: #1b1b1b; text-align:center; color:#aaa; font-size:12px; padding:20px; letter-spacing:-0.5px;}
	.sc_foot_m p{margin-bottom:10px; color:#fff; font-size:14px; font-weight:bold;}


 *{box-sizing:border-box;}
	html,body{width:100%; margin:0; padding:0;}
	
	a{text-decoration:none; margin:0; padding:0;}
	ul, li, ol{margin:0; pading:0; list-style:none;}
	.wrap{max-width:640px; margin:0 auto;}

	.db_box { background: #211a1e; padding: 10px;}

		.db_box td {font-family: "맑은 고딕";font-size: 16px;line-height: 24px;
			padding: 3px 0;
			color: #FFF;
			font-weight: bold;
		}

		#db_box {
			background: url(http://wecyd.com/biz/lotto/m03/db_bg.png) repeat-y;
			background-size: 100%;
			padding: 10px 30px;
		}
		select{background: #fff; -webkit-appearance: none; -moz-appearance: none; appearance: none; width:27%; height:40px; padding:0 10px; box-sizing:border-box; border-radius:5px; border:1px solid #ccc;}
		.inp{-webkit-appearance: none; -moz-appearance: none; appearance: none; width:85%; height:40px; padding:0 10px; box-sizing:border-box; border-radius:5px; border:1px solid #ccc;}
		.inp_tel{-webkit-appearance: none; -moz-appearance: none; appearance: none; width:27%; height:40px; padding:0 10px; box-sizing:border-box; border-radius:5px; border:1px solid #ccc;}

		.container_wrap{display:table; width:85%;}
			.container{display:table-cell; width:50%; border:1px solid #ddd; border-radius: 5px; padding:5px 0; text-align:center;}
				.container input[type="radio"]{width:0; height:0;}
					.check{background:#004c93; color:#fff;}
		.db_bt {text-align: center;margin: 15px auto;}
		.db_bt img {width: 80%; margin:0 auto;}
		.db_name{font-size: 12px;}
		.agree {font-size: 10px;color: #333;font-family: '맑은고딕';padding: 5px 0 5px 0;}

		/* input */
		.input_text_wrap{position:relative; width:78%; display:inline-block; font-size:16px; margin:5px 0px;}
			.input_text_wrap label input{width:100%; padding:10px 15px !important; color:#000; border:2px solid #ddd; outline:none; border-radius:4px; background:#fff; transition:all 0.15s; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
			.input_text_wrap label input:focus{border:2px solid #1a73e8;}
				.input_text_wrap label input:invalid:not(:focus)+* {cursor:text; border:0px; -webkit-transform:scale(1) translateY(0); transform:scale(1) translateY(0); transform-origin:left bottom;}
				.input_text_wrap label input:focus + span{color:#1a73e8;}
			.input_text_wrap label span{color:#999; position:absolute; top:22%; left:10px; padding:0px 5px; background:#fff; transition:all 0.15s; -webkit-transform:scale(0.75) translateY(-25px); transform:scale(0.75) translateY(-25px); transform-origin:left bottom;}

		/* tel-select */
		.select_wrap{text-align:center; width:78%; display:inline-block;}
			.select_wrap .input_select_wrap{width:30%; float:left; position:relative; margin: 10px 0px;}
				.select_wrap .input_select_wrap select{width:100%; padding:10px 15px; background:none; color:#000; border:2px solid #ddd; border-radius:4px;}
					.select_wrap .input_select_wrap select:-ms-expand{display:none;}
					.select_wrap .input_select_wrap select:focus{border:2px solid #1a73e8; outline:none;}
					.select_wrap .input_select_wrap:after{content:""; position:absolute; z-index:-1; right:10px; top:35%; width:5px; height:5px; border:solid #ccc; border-width:0 0 2px 2px; display:inline-block; -webkit-transform:rotate(-45deg); -ms-transform:rotate(-45deg); transform:rotate(-45deg);}
			.select_wrap .input_text_wrap{width:30%;}

			
		/* tel-select 1*/
		.select_wrap1{text-align:center; width:99%; display:inline-block;}
			.select_wrap1 .input_select_wrap1{width:100%; float:left; position:relative; margin: 10px 0px;}
				.select_wrap1 .input_select_wrap1 select{width:100%; padding:10px 15px; background:none; color:#000; border:2px solid #ddd; border-radius:4px;}
					.select_wrap1 .input_select_wrap1 select:-ms-expand{display:none;}
					.select_wrap1 .input_select_wrap1 select:focus{border:2px solid #1a73e8; outline:none;}
					.select_wrap1 .input_select_wrap1:after{content:""; position:absolute; z-index:-1; right:10px; top:35%; width:5px; height:5px; border:solid #ccc; border-width:0 0 2px 2px; display:inline-block; -webkit-transform:rotate(-45deg); -ms-transform:rotate(-45deg); transform:rotate(-45deg);}
			.select_wrap1 .input_text_wrap{width:30%;}

		/* tel-input */
		.input_tel_wrap{position:relative; width:23%; display:inline-block; font-size:16px; margin:5px 0px;}
			.input_tel_wrap label input{width:100%; padding:10px 15px !important; color:#000; border:2px solid #ddd; outline:none; border-radius:4px; background:#fff; transition:all 0.15s; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
			.input_tel_wrap label input:focus{border:2px solid #1a73e8;}
				.input_tel_wrap label input:invalid:not(:focus)+* {cursor:text; border:0px; -webkit-transform:scale(1) translateY(0); transform:scale(1) translateY(0); transform-origin:left bottom;}
				.input_tel_wrap label input:focus + span{color:#1a73e8;}
			.input_tel_wrap label span{color:#999;width: 100%; position:absolute; top:22%; left:10px; padding:0px 5px; background:#fff; transition:all 0.15s; -webkit-transform:scale(0.75) translateY(-25px); transform:scale(0.75) translateY(-25px); transform-origin:left bottom;}
			.input_tel_wrap:first-child{margin: 10px 35px 10px 0px;}
			.input_tel_wrap:last-child{float:right;}
				
		/* radio */
		.container_wrap {width: 100%; margin: 5px 0px; display: flex;}
		.container {width: 50%; border: 2px solid #ddd; color:#999; border-radius: 5px; padding: 12px 0; text-align: center; display:inline-table;}
		.container input{border: 1px solid #e2e2e2; width: 100%; height: 40px;  margin-top: 10px; font-size: 14px; background: #f3f3f3; font-weight: bold;}
		.container input[type="radio"] {width: 0; height: 0;}
		.check {background: #2646d2; color: #fff;}

		.font{font-size:15px;}



		/* check_box */
			.checkbox_wrap{font-size:11px; color:#666; font-weight:bold; display:inline-block; margin:10px 4px;}
				.checkbox{display:inline-block; margin-bottom:5px; position:relative; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;}
					.checkbox:last-child{margin-bottom:0;}
					.checkbox input[type=checkbox]{opacity:0; display:inline-block; width:16px; height:16px; margin:0;}
				.check_mark{border-radius:3px; position:absolute; top:5%; left:0; width:14px; height:14px; background:#fff; border:2px solid #ccc;}
					.check_mark:after{content:""; position:absolute; display:none;}
				.checkbox input:checked ~ .check_mark:after{display:block;}
				.checkbox .check_mark:after{left:3px; top:-3px; width:4px; height:9px; border:solid #666; border-width:0 2px 2px 0; -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg);}
				.checkbox input:checked ~ .check_mark{border:2px solid #666;}

	.copy_info_wrap{padding:10px; background:#eee; text-align:left; font-weight:bold; letter-spacing:-2.5; margin:10px;}
		.copy_info{padding:10px; background:#fff; border:1px solid #ddd;}
			.copy_info input{width:40%; padding:3px 0; border:1px solid #ddd; margin-right:2px; text-align:center;}
			.copy_info div{margin-top:3px;}
			.copy_info div input{width:30%;}