/*
	ID : Mobile CSS
	WORK : Shinjunho
	NOTE : 모바일 전용 CSS
*/
/***** Mobile ver *****/
@media all and (max-width:700px){

	/*layout set*/
	.wrap {width:100%}

	/***** GNB (WEB) *****/
	.GNB .wrap .menu {display:block;}
	.GNB .wrap {width:100%; height:60px;}
	.GNB .wrap .ci {position:absolute; left:50%; transform:translateX(-50%); width:50px; height:50px; position:relative;}
	.GNB .wrap ul.bt1 {background:#fff; float:none; display:none; margin-left:0px; width:0px; position:fixed; height:100vh; top:60px; right:0px; box-shadow:-2px 1px 3px rgba(0,0,0,0.2);}
	.GNB .wrap ul.bt1 a {display:block; color:#000; width:100%; line-height:60px; height:auto; font-size:1em; text-align:left; padding-left:10px; border-bottom:#eee solid 1px;}
	.GNB .wrap .bt1.active {display:block; width:65vw;}
	.GNB .wrap ul.bt2 {display:none;}
	.GNB_dep2 {display:none;}

	/***** footer *****/
	.footer {margin-top:30px;}
	.footer .wrap {padding:20px; font-size:0.786em;}
	.footer .wrap img {display:none;}
	.footer .wrap ul {position:relative; line-height:24px; top:0px; width:100%; text-align:center; background:#3c3c47; margin-top:10px; padding:5px 0;}
	.footer .wrap ul h1, .footer .wrap ul h2, .footer .wrap ul p {font-size:1.1em; font-weight:300; display:inline; padding:0 5px;}
	.quickmenu {display:none;}

	/***** iosSlider *****/
	.iosSlider {margin-top:60px; height:200px;}
	.iosSlider .selectorsBlock .selectors .item {width:9px; height:9px; margin:2px;}
	.iosSlider .selectorsBlock .selectors .selected {width:16px; }

	/***** index *****/
	/* 공통 */
	h1.title {font-size:1.4em; padding:25px 0;}
	h1.title p {font-size:0.7em; margin-top:15px;}
	/* 3열 레이아웃 */
	.row_banner {margin:0px; flex-flow:wrap; padding:10px;}
	.row_banner div {padding:20px 10px; margin:3px 0; height:auto; width:50%;}
	.lat h1 {font-size:1.3em !important; text-align:center; margin-bottom:10px; height:auto;}
	.lat li {line-height:25px !important;}
	.lat li a ,.lat li span{font-size:1em !important;}
	.row_banner .notice {min-width:100%;}
	.row_banner .time {text-align:center; padding-top:20px;}
	.row_banner .time a {padding-left:0px;}
	.row_banner .time h1 {font-size:1.2em;}
	.row_banner .time h1::before {content:"";}
	.row_banner .time ul {margin-top:20px;}
	.row_banner .time ul h2 {font-size:1em; width:100%;}
	.row_banner .time ul p {font-size:1.2em; font-weight:500; letter-spacing:-1px;}
	.row_banner .sns {text-align:center; border-left:none;}
	.row_banner .sns a {padding-left:0px;}
	.row_banner .sns h1 {font-size:1.2em;}
	.row_banner .sns ul {margin-top:20px;}
	.row_banner .sns ul h2 {font-size:1em; width:100%;}
	.row_banner .sns ul p {font-size:1.2em; font-weight:500; letter-spacing:-1px;}
	.row_banner .online {min-width:100%; padding:20px;}
	.row_banner .online h1 {font-size:1.3em;}
	.row_banner .online p {font-size:1em;}
	.row_banner .online a {margin-top:20px;}
	.row_banner .online::before {zoom:0.7;}
	/* 소개 */
	.company {padding-bottom:0px;}
	.company div {line-height:1.3em;}
	.company div ul {width:50%; padding:10px; margin:0px;}
	.company div ul li {display:inline-block; width:65%; height:0px; padding-top:65%;}
	.company div ul li img {width:65px; height:65px;}
	.company div ul h2 {font-size:1em; margin:10px 0;}
	.company div ul p {font-size:0.85em;}
	/* youtube */
	.youtube ul, .youtube ul:first-of-type {width:100%; height:200px;}

	/***** sub *****/
	.sub_topimage {margin-top:60px; height:100px;}
	.sub_topimage h1 {left:0px; top:50%; transform:translateY(-50%); height:auto; width:100%; text-align:center; font-size:1.3em;}
	/* table 프리셋*/
	table.style {font-size:0.9em;}
	table.style th ,table.style td {height:40px;}
	table.style td {padding:0px 5px;}
	.ment {margin-top:15px;}
	.ment p {font-size:0.9em; padding-left: 10px; text-indent: -12px;}

	/* LNB */
	.lnb {height:50px;}
	.lnb .wrap {display:flex;}
	.lnb .home {display:none;}
	.lnb a {flex:1; height:50px; line-height:50px; width:auto; font-size:0.8em; overflow:hidden; letter-spacing:-1px;}
	/* sub 공통 */
	.sub h1.title {font-size:1.5em; margin:25px 0;}
	.sub.center {margin-top:20px;}
	.safety, .line, .map ,.use ,.price ,.operate {padding:0 10px;}
	/* 소개 > 안전한 시설 */
	.safety article {margin-bottom:40px;}
	.safety article div {width:100%; height:auto; float:none; padding:20px 10px; margin-bottom:40px;}
	.safety article div h2 {font-size:1.2em; margin-bottom:10px; line-height:1.5em; text-align:center;}
	.safety article div p {font-size:0.9em; line-height:1.2em;}
	.safety img {width:100%;}
	.safety iframe {width:100%; height:200px}
	/* 소개 > 레인별 인원수 제한 */
	.line article {display:block;}
	.line article div img {width:100%;}
	.line article div.text {padding:40px 0px; }
	.line article div h2 {font-size:1.3em; margin-bottom:15px;}
	.line article div p {font-size:1em; line-height:22px; margin-bottom:15px;}
	.line article div table {width:100%; margin-top:25px;}
	.line article + article {margin-top:0px; border-top:#e1e1e1 solid 1px;}
	.line article div p.bold {font-size:1.3em; line-height:1.4em;}
	/* 소개 > 강력한 인공파도 즐기기 */
	.wave article img{width:100%;}
	.wave article div {position:relative; top:0px; left:0px; width:100%; height:auto; padding:30px 20px;}
	.wave article div h2 {font-size:1.3em; margin-bottom:15px;}
	.wave article div p {font-size:0.9em; line-height:1.4em;}
	/* 소개 > 위치안내 */
	.map #map_api { height:300px;}
	.map article h2 {font-size:1.3em;}
	.map article p {font-size:1em; line-height:1.5em;}
	.map article div {display:block;}
	.map article div ul {font-size:1em;}
	.map article div ul li {background-size:25px; background-position:0px 10px; padding-left:35px; margin-top:20px;}
	.map article div ul li + li {margin-top:20px;}
	.map article div ul li h3 {font-size:1em; color:#333;}
	/*공지사항*/
	.bo_tit {font-size:1em;}
	.notice table td.td_num, .notice table th:nth-child(3) {display:none;}
	#bo_v_title .bo_v_tit {font-size:2em;}
	#bo_v {padding:40px 20px;}
	.bo_v_nb li {line-height:1.5em;}
	.bo_v_nb li .nb_date {display:none;}
	/* 이용방법 및 가격 > 이용방법 */
	.use article img{width:100%;}
	.use article + article {margin-top:50px;}
	.use article h2 {font-size:1.3em;}
	.use article div {display:inline-flex; flex-wrap:wrap; flex-direction:row;}
	.use article div ul {max-width:32%; padding:10px 0;}
	.use article div ul:nth-child(3n+2) {margin:0px 2%;}
	.use article div ul img {width:80%;}
	.use article div ul h3 {font-size:1em;}
	.use article div ul p {font-size:0.9em;}
	.use table th:first-child {width:100px;}
	.use article .r2 table+table {margin-left: 0px; margin-top: 40px;}

	/* 이용방법 및 가격 > 가격 */
	.price article img{width:100%;}
	.price article+article {margin-top:50px;}
	.price article h2 {font-size:1.3em;}
	.price article table {font-size:0.9em;}
	.price article table th:nth-child(1), .price article table th:nth-child(2) {width:auto;}
	.price article table td span::before {position:relative; right:5px;}
	.price article table td span::after {position:relative; left:0px; width:auto; display:block;}
	.price article table td span1::before {position:relative; right:5px;}
	.price article table td span1::after {position:relative; left:0px; width:auto; display:block;}
	.price article table td span2::before {position:relative; right:5px;}
	.price article table td span2::after {position:relative; left:0px; width:auto; display:block;}
	.price article table td:last-child {font-weight:500;}

	/* 이용방법 및 가격 > 비수기,성수기 운영안내 */
	.operate article h2 {font-size:1.3em;}
	.operate article table {font-size:0.9em;}
	.operate article table th:nth-child(1), .operate article table th:nth-child(2) {width:auto;}
	.booking .mobile {display:block;}
	.booking iframe {display:none;}
}

@media all and (min-width:701px){
	.GNB .wrap .menu {display:none;}
}