@charset "utf-8"; 

@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css); 

* {margin:0; padding:0; }
body {color:#504a45; line-height:1.2; font-family:"Nanum Gothic",AppleGothic,Droid Sans,Arial,Sans-serif !important}
html{overflow:hidden; overflow-y:scroll; font-size:16px;}

h1, h2, h3, h4, h5, h6 {font-size:1em; font-weight:normal; font-family:"Nanum Gothic",AppleGothic,Droid Sans,Arial,Sans-serif}
hr {display:none}
ul, ol, li {list-style-type:none; font-family:"Nanum Gothic",AppleGothic,Droid Sans,Arial,Sans-serif}
fieldset{margin:0; padding:0; border:0}
legend,caption {display:none}
address, em, cite {font-style:normal}
input, button, textarea, select {margin:0; padding:0; font-size:1em; font-family:"Nanum Gothic",AppleGothic,Droid Sans,Sans-serif}
button, textarea, input, object, select {display:inline-block; vertical-align:middle}
code, pre {font-size:1em}
button{overflow:visible; border:none}
img{vertical-align:middle;}
a{color:#333; text-decoration:none}
a:hover{text-decoration:none;}

.clear{*height:1%}
.clear:after{content:"."; height:0; visibility:hidden; display:block; clear:both}
* html .clear{height:1%}
.cboth{clear:both}
.cboth:after{content:""; clear:both; display:block}

.hidden{position:absolute !important; visibility:hidden !important; top:-9999px !important; left:-9999px !important; font:0/0 Arial}

/* important css */
.t_left {text-align:left !important}
.t_center {text-align:center !important}
.t_right {text-align:right !important}
.f_left {float:left !important}
.f_center {float:enter !important}
.f_right {float:right !important}

.t_normal{font-weight:normal !important}
.t_sp{letter-spacing:-1px !important}

.marT0{margin-top:0px !important}
.marT5{margin-top:5px !important}
.marT10{margin-top:10px !important}
.marT15{margin-top:15px !important}
.marT20{margin-top:20px !important}
.marT25{margin-top:25px !important}
.marT30{margin-top:30px !important}
.marT35{margin-top:35px !important}
.marT40{margin-top:40px !important}
.marT45{margin-top:45px !important}
.marT50{margin-top:50px !important}

/* skipNavigation */
#skipNavi{width:100%; position:relative; overflow:hidden; margin:0 auto}
#skipNavi a{display:block; background:#3a105e; font-weight:bold; width:0; height:0; font-size:0; line-height:0; margin:0 -1px -2px 0; overflow:hidden; font-size:16px; text-align:center}
#skipNavi a:hover, #skipNavi a:active, #skipNavi a:focus{height:40px; line-height:1.2; margin:0; padding-top:10px; width:auto; text-decoration:none; color:#fff}

/* layout */
body{}
#wrapper{position:relative; z-index:100}
#wrapper header{position:relative; padding-top:3px; font-family:Arial; color:#fff; text-align:center}
#wrapper header div{position:relative; margin:0 3px 3px; padding:3.98% 0; background-color:rgba(0, 0, 0, 0.35); 
	-webkit-box-shadow: 0 3px 3px 0 #2d86ce;
	-moz-box-shadow: 0 3px 3px 0 #2d86ce;
	box-shadow: 0 3px 3px 0 #2d86ce;
}
#wrapper header div a{position:absolute; left:12px; top:30%; width:5.5%;}
#wrapper header div a img{width:100%; vertical-align:top;}
.container{position:relative;}
footer{position:relative; padding:4.2% 30px 1.2%; color:#a8a8a8; font-weight:bold; text-align:center; z-index:100}
footer img{display:inline-block; width:34.0%;}
footer img:nth-child(2){width:39.81%; margin-left:28px;}
footer img+p{margin-top:3.88%}


/* font */
.tbold01{ font-weight:bold;}

/* color */
.tBlue01{color:#3e86c1;}
.tBlue02{color:#226398;}
.tBlack01{color:#444444;}

/* array */
.al{text-align:left;}
.ar{text-align:right;}
.ac{text-align:center;}

/* width */
.wid01{width:83%;}

/* table */
.tbl01{width:100%;}
.tbl01 td.td1{width:50%;}

/* boarder */
.bod01{border:1px solid #eee;}
.bodb01{border-bottom:1px solid #eee;}
.bodl01{border-left:1px solid #eee;}

/* padding */
.pdt01{padding-top:10px;}
.pdr01{padding-right:0px;}
.pdb01{padding-bottom:10px;}
.pdl01{padding-left:0px;}

/* blind */
#purdiBlind {position:absolute;display:none;height:100%;left:0px;top:0px;background-color:#000000;z-index:5000;}
#purdiPop{position:absolute;display:none;margin:0; padding:0;width:100%;height:100%;z-index:5010;}
#purdiPop div.area{margin:0 auto; width:98%; height:98%; background:#ffffff;overflow-y:auto;}
#purdiPop div.area div.out{margin:10px 10px 0 10px}

.purdiBlind {position:absolute;display:none;height:100%;left:0px;top:0px;background-color:#000000;z-index:5000;}
.purdiPop{position:absolute;display:none;margin:0; padding:0;z-index:5010;}
.purdiPop div.area{margin:0 auto; width:98%; height:98%; background:#ffffff;overflow-y:auto;}
.purdiPop div.area div.out{margin:10px 10px 0 10px}

/* form */
select, input[type=text], input[type=password], input[type=number], input[type=search], input[type=email], input[type=tel], input[type=date], textarea{padding:5px 0 4px 5px; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -webkit-appearance:none; -webkit-border-radius:0; font-family:"Nanum Gothic",AppleGothic,Droid Sans,Arial,Sans-serif; border:1px solid #cfcfcf; border-radius:3px;}
input[type=text]:focus, input[type=password]:focus, input[type=number]:focus, input[type=search]:focus, input[type=email]:focus, input[type=tel]:focus, input[type=date], textarea:focus{}
label.inpRadio, label.inpCheck{position:relative;display:block;margin:5px 10px 5px 0;}
input[type=checkbox]{-webkit-appearance:none; display:inline-block;position:absolute;top:0;left:1px;width:10px;height:10px; vertical-align:middle; border:0 none;}
input[type=radio]{-webkit-appearance:none; display:inline-block;position:absolute;top:0;left:1px;width:10px;height:10px; vertical-align:middle; border:0 none;}
label.inpCheck input[type=checkbox]+span{position:relative;padding:0 0 0 18px;line-height:1;background:#fff; height:13px; width:13px; -webkit-appearance:none; background:url(../img/bg_checkbox.png) no-repeat 0 1px; background-size:13px 13px; z-index:1;}
label.inpRadio input[type=radio]+span{position:relative;padding:0 0 0 18px;line-height:1;background:#fff; height:13px; width:13px; -webkit-appearance:none; background:url(../img/bg_checkbox.png) no-repeat 0 1px; background-size:13px 13px; z-index:1;}
label.inpCheck input[type=checkbox]:checked+span{background:url(../img/bg_checkbox_on.png) no-repeat 0 1px; background-size:13px 13px}
label.inpRadio input[type=radio]:checked+span{background:url(../img/bg_checkbox_on.png) no-repeat 0 1px; background-size:13px 13px}
select{width:100%; background:#fff url(../../app/resources/oqt/img/common/bg_select.png) no-repeat right 45%; background-size:11px 8px}

/* main */
.mainWrapper{padding-bottom:48.88%; background:url(../img/bg_main.png) no-repeat 0 0; background-size:cover; text-align:center;}
.mainWrapper section div{margin:40px 0 0; font-size:24px; font-weight:bold; color:#b0d7f7;}
.mainWrapper section a img{width:33.05%;}
.mainWrapper section div a img{width:68.61%;margin-bottom:10px;}
.mainWrapper section div div.menu{position:relative;margin:0 auto;width:68.61%;margin-bottom:10px;}
.mainWrapper section div div.menu2{width:12.82%;position:absolute;top:-30px;right:12px;}
.mainWrapper section div div.menu img.img1{width:100%;cursor:pointer;}
.mainWrapper section .visualArea{margin-bottom:14px;}
.mainWrapper section .visualArea img{width:63.61%;}
.mainWrapper section div+a{margin-right:20px;}

/* sub */
.subWrapper .container{padding-top:14px;}
.innerType1{padding:0 13px 7px; background:url(../img/bg_subtype01.png) repeat-x 0 100%; background-size:1px 7px;}
.innerType1_2{padding:0 13px 7px; background:url(../img/bg_subtype02.png) no-repeat; padding-top:20px;padding-bottom:20px;border-bottom:10px solid #eeeeee;}
.innerType1_pop{padding:0 13px 7px; }
.innerType2{padding:8px 0 21px; background-color:#eee;}
.innerType3{padding:2px 0 2px; background-color:#eee;}

.addBox{margin-bottom:25px; font-size:1.2rem;}
.addBox figcaption span{display:block; margin:10px 0; font-size:0.75rem;}
.addBox figcaption span.sp1{font-size:0.95rem;}
.addBox2{margin-bottom:2px; font-size:1.2rem;}
.addBox2 figcaption span{display:block; margin:10px 0; font-size:0.75rem;}
.mapBox{margin:8px 0 6px; border:1px solid #a4a4a4;}

.formWrite{position:relative;}
.formWrite ul li{display:-webkit-box; display:box; -webkit-box-align:center; width:100%; margin-bottom:4px;}
.formWrite ul li label{display:block; width:20%; padding-left:15px; background:url(../img/bg_list01.png) no-repeat 0 1px; background-size:11px 11px; color:#444; font-weight:bold;}
.formWrite ul li label+div{width:100%;
	box-flex:1;
	-webkit-box-flex:1;
	-moz-box-flex:1;
}
.formWrite ul li label+div input{width:100%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.formWrite ul li .req_div1 {width:70%;}
.formWrite ul li .req_div1_btn {width:30%;}
.formWrite ul li .req_div2 {width:70%;}
.formWrite ul li .req_div2_btn {width:30%;}



.formWrite ul li label+div.type2{display:-webkit-box; display:box; width:100%;}
.formWrite ul li label+div.type2 input{display:block;
	box-flex:3;
	-webkit-box-flex:3;
	-moz-box-flex:3;
}
.formWrite ul li label+div.type2 input:first-child{margin-right:2px;}
.formWrite ul li .noLabel{position:relative; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; width:100%; margin:16px 0 10px 0; padding-left:18%;}
.formWrite ul li .noLabel label{display:inline-block; width:auto; margin-right:10px; padding-left:0; background:none; color:#797979;}
.formWrite ul li .noLabel a{position:absolute; right:0; top:-6px;}

.formWrite ul li .noLabel2{position:relative; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; width:100%; margin:16px 0 10px 0; padding:0;text-align:center;}
.formWrite ul li .noLabel2 label{display:inline-block; width:auto; margin-right:10px; padding-left:0; background:none; color:#797979;}

.formWrite ul li .noLabel3{position:relative; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; width:100%; margin:0 0 10px 0; padding-left:18%;}
.formWrite ul li .noLabel3 label{display:inline-block; width:auto; margin-right:10px; padding-left:0; background:none; color:#797979;}

.formWrite ul li .noLabel4{position:relative; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; width:100%; margin:16px 0 10px 0;}
.formWrite ul li .noLabel4 label{display:inline-block; width:auto; margin-right:10px; padding-left:0; background:none; color:#797979;}
.formWrite ul li .noLabel4 a{position:absolute; right:0; top:-6px;}

.formWrite ul li .noLabel5{position:relative; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; width:100%; margin:0 0 10px 0;}
.formWrite ul li .noLabel5 label{display:inline-block; width:auto; margin-right:10px; padding-left:0; background:none; color:#797979;}
.formWrite ul li .noLabel5 a{position:absolute; right:0; top:-6px;}

.formWrite .btnSearch{position:absolute; left:50%; bottom:-13px; margin-left:-9px; padding:3px; background-color:#fff; border-bottom:1px solid #d6d6d6; border-radius:50%;

}



.formWrite .btnSearch img{
	transform:             rotate( -360deg );            
	-moz-transform:    rotate( -360deg );            
	-ms-transform:     rotate( -360deg );            
	-o-transform:      rotate( -360deg );            
	-webkit-transform: rotate( -360deg );            
	transition:             transform 550ms ease;
	-moz-transition:    -moz-transform 550ms ease;
	-ms-transition:     -ms-transform 550ms ease;
	-o-transition:      -o-transform 550ms ease;
	-webkit-transition: -webkit-transform 550ms ease;
}
.formWrite .btnSearch.hide img{
	transform:             rotate( -180deg );            
	-moz-transform:    rotate( -180deg );            
	-ms-transform:     rotate( -180deg );            
	-o-transform:      rotate( -180deg );            
	-webkit-transform: rotate( -180deg );            
	transition:             transform 550ms ease;
	-moz-transition:    -moz-transform 550ms ease;
	-ms-transition:     -ms-transform 550ms ease;
	-o-transition:      -o-transform 550ms ease;
	-webkit-transition: -webkit-transform 550ms ease;
}
.formResult ul li{margin:0 3px 5px; padding:10px; background-color:#fff;
	-webkit-box-shadow: 0 2px 3px 0 #d6d6d6;
	-moz-box-shadow: 0 2px 3px 0 #d6d6d6;
	box-shadow: 0 2px 3px 0 #d6d6d6;
}
.formResult ul li .column,
.formResult ul li .column2,
.formResult ul li .column3{display:-webkit-box; display:box; margin-bottom:10px; color:#676767;}
.formResult ul li .column:last-child,
.formResult ul li .column2:last-child,
.formResult ul li .column3:last-child{margin-bottom:0;}
.formResult ul li .column span,
.formResult ul li .column strong{display:block; width:100%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.formResult ul li .column2 span{display:block; width:40%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;
	box-flex:1;
	-webkit-box-flex:1;
	-moz-box-flex:1;
}
.formResult ul li .column2 strong{display:block; width:60%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;
	box-flex:1;
	-webkit-box-flex:1;
	-moz-box-flex:1;
}
.formResult ul li .column2 p{font-weight:bold;text-align:right;}

.formResult ul li .column2 span:last-child,
.formResult ul li .column2 strong:last-child{text-align:right;}
.formResult ul li .column2 strong a{margin-left:2px;}
.formResult ul li .column2 strong a:first-child{margin-left:0;}
.formResult ul li .column3 span,
.formResult ul li .column3 strong{display:block; width:33.33%; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;
	box-flex:3;
	-webkit-box-flex:3;
	-moz-box-flex:3;
}
.formResult ul li .column3 span:last-child,
.formResult ul li .column3 strong:last-child{text-align:right;}

/* common */
.btnGray{padding:3px;color:#3e86c1;border:1px solid #958c65;background:url(../img/bg_btn02.png) repeat-x;}
.btnBlue{padding:7px 14px; background-color:#3e86c1; color:#fff; border:0;}
.btnBlue2{float:right;width:16%; padding:5px 0 4px 5px; background-color:#3e86c1; color:#fff; border:0; vertical-align:middle;text-align:center;}

.btnType2{display:-webkit-box; display:box; width:100%; text-align:center;}
.btnType2 a{display:block; width:100%; padding:2.5% 0 2.2%; background:#73c579 url(../img/bg_btn01.png) no-repeat 0 100%; background-size:10%; border:1px solid #36883c; border-radius:1px; color:#0e4913; line-height:16px; font-weight:bold;
	box-flex:2;
	-webkit-box-flex:2;
	-moz-box-flex:2;
}
.btnType2 a:first-child{margin-right:3px;}
.btnMore{text-align:center;}
.btnMore a{display:inline-block; width:50%; margin-top:10px; padding:6px 0; background:#3e86c1 url(../img/bg_more.png) no-repeat 98% 7px; background-size:22px 22px; border-radius:18px; color:#d8e7f3; font-weight:bold; text-align:center;}

.btnMore2{text-align:center;}
.btnMore2 a{display:inline-block; width:50%; margin-top:3px; padding:6px 0; background:#3e86c1 url(../img/bg_more.png) no-repeat 98% 7px; background-size:22px 22px; border-radius:18px; color:#d8e7f3; font-weight:bold; text-align:center;}

.btnMore3{text-align:center;display:inline-block; width:50%; margin-top:10px;border:0; padding:6px 0; background:#3e86c1 url(../img/bg_more.png) no-repeat 98% 7px; background-size:22px 22px; border-radius:18px; color:#d8e7f3; font-weight:bold; text-align:center;}
.btnMore4{text-align:center;display:inline-block; width:24%; margin-top:10px;border:0; padding:6px 0; background:#3e86c1; border-radius:6px; color:#d8e7f3; font-weight:bold; text-align:center;letter-spacing:0.1px;}
.btnMore4_1{text-align:center;display:inline-block; width:24%; margin-top:10px;border:0; padding:6px 0; background:#ec8500; border-radius:6px; color:#ffffff; font-weight:bold; text-align:center;letter-spacing:0.1px;}
.btnMore4_2{text-align:center;display:inline-block; width:24%; margin-top:10px;border:0; padding:6px 0; background:#898989; border-radius:6px; color:#ffffff; font-weight:bold; text-align:center;letter-spacing:0.1px;}
.btnMore4_3{text-align:center;display:inline-block; width:49%; margin-top:10px;border:0; padding:6px 0; background:#3e86c1; border-radius:6px; color:#d8e7f3; font-weight:bold; text-align:center;letter-spacing:0.1px;}
.btnMore5{text-align:center;display:inline-block; width:32%; margin-top:10px;border:0; padding:6px 0; background:#3e86c1; border-radius:6px; color:#d8e7f3; font-weight:bold; text-align:center;letter-spacing:0.1px;}

.mapBox #map{height:400px;}
.addBox table.tbl01 tr td #map{height:700px;}

@media all and (max-width: 320px) {
	html{font-size:0.75rem;}
	#wrapper header div{font-size:1.25rem;}
	.mainWrapper section div{font-size:1.8rem;}
	.btnMore a{background-position:98% 3px; background-size:18px 18px;}
	.btnMore2 a{background-position:98% 3px; background-size:18px 18px;}
	.btnMore3 a{background-position:98% 3px; background-size:18px 18px;}
	.btnMore4{font-size:90%;}
	.btnMore4_1{font-size:90%;}
	.btnMore4_2{font-size:90%;}
	.btnMore4_3{font-size:90%;}
	.btnMore5{font-size:80%;}
	.btnGray{font-size:80%;}

	.formWrite ul li label{width:70px;}
	.formWrite ul li .noLabel{padding-left:10px;}
	.formWrite ul li .noLabel2{padding-left:70px;}
	.formWrite ul li .noLabel3{padding-left:10px;}

	.wid01{width:70%;}
	.btnBlue2{width:29%;}

	.days{font-size:0.2rem;color:#000000;}
	.daye{font-size:0.2rem;color:#000000;}
}
@media all and (min-width: 321px) and (max-width: 700px){
	html{font-size:0.90rem;}
	#wrapper header div{font-size:1.5rem;}
	.mainWrapper section div{font-size:2rem;}
	.btnMore a{background-position:98% 3px;}
	.btnMore2 a{background-position:98% 3px;}
	.btnMore3 a{background-position:98% 3px;}
	.btnMore4{font-size:90%;}
	.btnMore4_1{font-size:90%;}
	.btnMore4_2{font-size:90%;}
	.btnMore4_3{font-size:90%;}
	.btnMore5{font-size:80%;}
	.btnGray{font-size:80%;}

	label.inpCheck input[type=checkbox]+span{background-position:0 2px;}
	.formWrite ul li label{width:28%;background-position:0 2px;}
	.formWrite ul li .noLabel{padding-left:2%;}
	.formWrite ul li .noLabel2{padding-left:22%;}
	.formWrite ul li .noLabel3{padding-left:5%;}

	.wid01{width:75%;}
	.btnBlue2{width:24%;}

	footer p{font-size:0.60rem;}

	.days{font-size:0.65rem;color:#000000;}
	.daye{font-size:0.65rem;color:#000000;}
}
@media all and (min-width: 701px) {
	html{font-size:1.25rem;}
	#wrapper header div{font-size:1.8rem;}
	.mainWrapper{padding-bottom:66.88%;}
	.mainWrapper section div{font-size:2.6rem;}

	label.inpCheck input[type=checkbox]+span{background-position:0 3px;}
	.formWrite ul li label{background-position:0 3px;}
	.formWrite ul li .noLabel{padding-left:22%;}
	.formWrite ul li .noLabel2{padding-left:22%;}
	.formWrite ul li .noLabel3{padding-left:5%;}

	footer p{font-size:0.90rem;}
}

/* iphone height */
@media all and (max-height: 1280px) {
	.mainWrapper{padding-bottom:44%;}
	.mapBox #map{height:800px;}
	.addBox table.tbl01 tr td #map{height:600px;}
}
@media all and (max-height: 1024px) {
	.mainWrapper{padding-bottom:24%;}
	.mapBox #map{height:700px;}
	.addBox table.tbl01 tr td #map{height:500px;}
}
@media all and (max-height: 960px) {
	.mainWrapper{padding-bottom:44%;}
	.mapBox #map{height:600px;}
	.addBox table.tbl01 tr td #map{height:450px;}
}
@media all and (max-height: 736px) {
	.mainWrapper{padding-bottom:58%;}
	.mapBox #map{height:500px;}
	.addBox table.tbl01 tr td #map{height:350px;}
}
@media all and (max-height: 667px) {
	.mainWrapper{padding-bottom:48%;}
	.mapBox #map{height:450px;}
	.addBox table.tbl01 tr td #map{height:300px;}
}
@media all and (max-height: 640px) {
	.mainWrapper{padding-bottom:38%;}
	.mapBox #map{height:400px;}
	.addBox table.tbl01 tr td #map{height:300px;}
}
@media all and (max-height: 480px) {
	.mainWrapper{padding-bottom:24%;}
	.mapBox #map{height:400px;}
	.addBox table.tbl01 tr td #map{height:200px;}
}