<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">@charset "UTF-8";

/*------------------------------------------------------------------------------------------------*/
/* Common */
/*
html										{scroll-behavior:smooth;}
body 									{-ms-overflow-style: none; scrollbar-width: none; }
body::-webkit-scrollbar 					{display: none;}
*/


section 									{width:100%; position:relative; height:100%; overflow: hidden;}
section .section							{position:relative;width:100%;height:100%;overflow:hidden;}

section .section .txt a 					{position:relative;width:80%;height:50px;display:block;letter-spacing:1px;background:#58939d;overflow:hidden;}
section .section .txt a div.back 			{position:absolute;top:0;left:0;width:100%;height:100%;background:#007488;transition: 0.5s;}
section .section .txt a div.mask 			{position:relative;padding-top:20px;}
section .section .txt a div.mask div 		{height:15px;overflow:hidden;}
section .section .txt a div.mask div span	{text-align:center;display:block;color:#fff;font-size:14px;}
section .section .txt a div.mask div span	{font-family:athelas,serif;}
section .section .txt a div.mask div span	{transition:transform 0.5s cubic-bezier(.65,0,.35,1)}
		
section .section .txt a:hover div.back 		{top:100%;}
section .section .txt a:hover div.mask span	{transform: translateY(-100%)}
.visual {width:100%; height:100vh; position:relative; z-index:1;}

.sub #banner 							    {height:800px;min-height:562px;overflow:hidden;}	
.sub #banner:before 						{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0.2;background:#000;content:"";}
.sub .section:first-child h2 				{position:absolute;bottom:10%;left:3%;z-index:1;}
			
/* MyFrame */		
.MyFrame 								    {position:absolute;top:0;bottom:0;left:0;right:0;width:100%;height:100%;overflow:hidden;}
.MyFrame #MyVideo		 					{position:absolute;top:50%;left:50%;transform: translate(-50%,-50%);}
.MyFrame #MyVideo		 					{min-width:100%;min-height:100%;width:auto;object-fit:cover;}
		
/* Scroll */		
#scroll 									{position:absolute;bottom:0;left:0;width:calc(50% + 60px);height:50px;z-index:10;}
#scroll .InBox 							    {position:relative;width:100%;height:100%;overflow:hidden;}
#scroll .InBox .line 						{position:absolute;top:20px;left:0;width:calc(100% - 120px);height:1px;background:#fff;opacity:0.8;}
#scroll .InBox a 							{position:absolute;top:0;right:0;}
		
/* Slide */
.slide 									    {position:relative;width:100%;height:100%;overflow:hidden;}
.slide_show 								{position:relative;width:100%;height:100%;overflow:hidden;}
.slide_show &gt; li 							{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;}
.slide_show &gt; li.active 					{z-index:100!important;}
.slide #nav {display:block; position: absolute; bottom:50%; transform:translateY(50%); z-index:499; width:100%;}
.slide #nav &gt; a 							{position:absolute;transition: 0.3s ease;z-index:350;}
.slide #nav &gt; a 							{width:67px;height:auto;}
	
/* Slide_01 */	
.slide_01 #nav &gt; a						    {bottom:5px;}
.slide_01 #nav &gt; a.prev					    {left:1px;}
.slide_01 #nav &gt; a.next					    {right:1px;}
.slide_01 #nav &gt; a:hover					{opacity:0.85;}
.slide_01 #nav &gt; ul 						{position:absolute;left:3.5%;bottom:35px;overflow:hidden;z-index:350;}
.slide_01 #nav &gt; ul li 					    {float:left;width:21px;}
.slide_01 #nav &gt; ul li a 					{width:17px;height:17px;display:block;margin:0 auto;background:url(../images/off.png) no-repeat 0 0;}
.slide_01 #nav &gt; ul li a.active 			{background:url(../images/on.png) no-repeat 0 0;}

/* slide_02 */
.slide_02 								    {max-width:1300px;margin:0 auto;overflow:visible!important;}
.slide_02 .slide_show 					    {position:relative;width:100%;height:100%;overflow:visible!important;}
.slide_02 .slide_show li					{position:absolute;top:0;left:0;width:100%;height:100%;}
.slide_02 .slide_show li div 				{position:absolute;top:0;left:0;width:100%;height:100%;}
.slide_02 .slide_show li div 				{transform: scale(0.9);}
.slide_02 .slide_show li div 				{transition: 0.5s;}
.slide_02 .slide_show li div:before 		{background:#f4f4f4;position:absolute;left:0;top:0;width:100%;height:100%;content:"";opacity:0.7;}
.slide_02 .slide_show li div:before 		{transition:all 0.5s;}
.slide_02 .slide_show li.active div 		{transform: scale(1);}
.slide_02 .slide_show li.active div 		{transition: all 0.5s;}
.slide_02 .slide_show li.active div:before 	{opacity:0;}

.slide_02 #nav &gt; a.prev					    {left:0}
.slide_02 #nav &gt; a.next					    {right:0;}
.slide_02 #nav &gt; a:hover					{opacity:0.85;}
.slide_02 #nav &gt; ul 						{position:absolute;left:3.5%;bottom:35px;overflow:hidden;z-index:350;}
.slide_02 #nav &gt; ul li 					    {float:left;width:21px;}
.slide_02 #nav &gt; ul li a 					{width:17px;height:17px;display:block;margin:0 auto;background:url(../images/off.png) no-repeat 0 0;}
.slide_02 #nav &gt; ul li a.active 			{background:url(../images/on.png) no-repeat 0 0;}

.Swipers {max-width:100%; overflow:hidden;}	
.Swipers .InBox {height:100vh;;}
.Swipers .swiper-container {height:100%;}
.Swipers .swiper-slide &gt; div {width:100%;height:100%;transition:1s;opacity:0.2;}
.Swipers .swiper-slide &gt; div {background-position:50% 50%;background-repeat:no-repeat;background-size:cover;}
.Swipers .swiper-slide-active &gt; div {transition:1s;opacity:1;}
.Swipers .swiper-slide .visual_bg {position: absolute; top:0; left:0; width:100%; height:100%; opacity:1; z-index:1000;}

.Swipers .swiper-btns {position:absolute; left:1px; bottom:0; width:250px; height:132px;}
.Swipers .swiper-btn {position:absolute; bottom:0; color:#fff; font-size:75px; z-index:10; cursor:pointer;}
.Swipers .swiper-btn {background-size:contain; background-position:center; background-repeat:no-repeat;}
.Swipers .swiper-pagination {bottom:60px; left:50%; width:auto; transform:translateX(-50%);}
.Swipers .swiper-button-prev {background-image:url(../images/prev.png); left:2%; top:50%; transform:translateY(-50%);}
.Swipers .swiper-button-next {background-image:url(../images/next.png); right:2%; top:50%; transform:translateY(-50%)}
.Swipers .swiper-pagination-bullet {width:35px; height:19px; display:inline-block;}
.Swipers .swiper-pagination-bullet {background:url(../images/off.png) no-repeat left top;}
.Swipers .swiper-pagination-bullet {transition: transform 0.3s ease;}
.Swipers .swiper-pagination-bullet-active {background:url(../images/on.png) no-repeat left top;}
/*------------------------------------------------------------------------------------------------*/
/* Images */
#index .list .img {background:url(http://gonylab9.speedgabia.com/penta/main/location.jpg) no-repeat 50% 50%;background-size:cover;}
.restaurant .r01 a div 					{background:url(http://gonylab9.speedgabia.com/penta/main/foods/1.jpg) no-repeat 50% 50%;background-size:cover;}
.restaurant .r02 a div 					{background:url(http://gonylab9.speedgabia.com/penta/main/foods/2.jpg) no-repeat 50% 50%;background-size:cover;}
.restaurant .r03 a div 					{background:url(http://gonylab9.speedgabia.com/penta/main/foods/3.jpg) no-repeat 50% 50%;background-size:cover;}
.restaurant .r04 a div 					{background:url(http://gonylab9.speedgabia.com/penta/main/foods/4.jpg) no-repeat 50% 50%;background-size:cover;}


#video #banner 							{background:url(http://gonylab9.speedgabia.com/penta/banner/1.jpg) no-repeat 50% 50%;background-size:cover;}
#location #banner 						{background:url(http://gonylab9.speedgabia.com/penta/banner/1.jpg) no-repeat 50% 50%;background-size:cover;}
#media #banner 							{background:url(http://gonylab9.speedgabia.com/penta/banner/1.jpg) no-repeat 50% 50%;background-size:cover;}

.rooms_01 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/room/1/0.jpg) no-repeat 50% 50%;background-size:cover;}
.rooms_02 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/room/2/0.jpg) no-repeat 50% 50%;background-size:cover;}
.rooms_03 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/room/3/0.jpg) no-repeat 50% 50%;background-size:cover;}
.rooms_04 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/room/4/0.jpg) no-repeat 50% 50%;background-size:cover;}
.rooms_05 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/room/5/0.jpg) no-repeat 50% 50%;background-size:cover;}
.rooms_06 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/room/6/0.jpg) no-repeat 50% 50%;background-size:cover;}
.rooms_07 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/room/7/0.jpg) no-repeat 50% 50%;background-size:cover;}

#fpv #banner 							{background:url(http://gonylab9.speedgabia.com/penta/facility/1/0.jpg) no-repeat 50% 50%;background-size:cover;}
.facil_01 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/facility/1/0.jpg) no-repeat 50% 50%;background-size:cover;}
.facil_02 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/facility/2/0.jpg) no-repeat 50% 50%;background-size:cover;}
.facil_03 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/facility/3/0.jpg) no-repeat 50% 50%;background-size:cover;}
.facil_04 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/facility/4/0.jpg) no-repeat 50% 50%;background-size:cover;}
.facil_05 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/facility/5/0.jpg) no-repeat 50% 50%;background-size:cover;}
.facil_06 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/facility/6/0.jpg) no-repeat 50% 50%;background-size:cover;}
.facil_07 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/facility/7/0.jpg) no-repeat 50% 50%;background-size:cover;}
.facil_08 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/facility/8/0.jpg) no-repeat 50% 50%;background-size:cover;}
.facil_09 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/facility/9/0.jpg) no-repeat 50% 50%;background-size:cover;}
.facil_10 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/facility/10/0.jpg) no-repeat 50% 50%;background-size:cover;}

.facil_01 #slides .img	 				{background:url(http://gonylab9.speedgabia.com/penta/pool/7.jpg) no-repeat 50% 50%;background-size:cover;}
#food #slides .img	 					{background:url(http://gonylab9.speedgabia.com/penta/food/8.jpg) no-repeat 50% 50%;background-size:cover;}

#offers #banner 						{background:url(http://gonylab9.speedgabia.com/penta/banner/3.jpg) no-repeat 50% 50%;background-size:cover;}
#voucher #banner 						{background:url(http://gonylab9.speedgabia.com/penta/banner/3.jpg) no-repeat 50% 50%;background-size:cover;}
#reserve #banner 						{background:url(http://gonylab9.speedgabia.com/penta/banner/2.jpg) no-repeat 50% 50%;background-size:cover;}
#reserve-220613 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/banner/2.jpg) no-repeat 50% 50%;background-size:cover;}
#community #banner						{background:url(http://gonylab9.speedgabia.com/penta/banner/3.jpg) no-repeat 50% 50%;background-size:cover;}
#qna #banner							{background:url(http://gonylab9.speedgabia.com/penta/banner/2.jpg) no-repeat 50% 50%;background-size:cover;}

#header .gnb &gt; div div.bg:first-of-type {background:url(http://gonylab9.speedgabia.com/penta/main/1.jpg) no-repeat 50% 50%;background-size:cover;}
#header .gnb &gt; div div.bg:nth-of-type(2) {background:url(http://gonylab9.speedgabia.com/penta/main/2.jpg) no-repeat 50% 50%;background-size:cover;}
#header .gnb &gt; div div.bg:nth-of-type(3) {background:url(http://gonylab9.speedgabia.com/penta/main/3.jpg) no-repeat 50% 50%;background-size:cover;}
#header .gnb &gt; div div.bg:nth-of-type(4) {background:url(http://gonylab9.speedgabia.com/penta/main/4.jpg) no-repeat 50% 50%;background-size:cover;}
#header .gnb &gt; div div.bg:nth-of-type(5) {background:url(http://gonylab9.speedgabia.com/penta/main/5.jpg) no-repeat 50% 50%;background-size:cover;}
#header .gnb &gt; div div.bg:last-of-type {background:url(http://gonylab9.speedgabia.com/penta/main/5.jpg) no-repeat 50% 50%;background-size:cover;}

/*------------------------------------------------------------------------------------------------*/
/* Header */
/* header - default */
#header {display:none;}
#nav {display:none;}
header                                              {position:fixed;top:0;left:0;width:100%;z-index:500;}
header hgroup                                              {position:relative;width:100%;height:75px;background:#fff;border-bottom:1px solid #e8e8e8;overflow:visible;}
header hgroup #lnb                                         {float:left;width:65%;min-width:580px;height:75px;position:absolute; left:50%; transform:translateX(-50%);}
header hgroup #lnb .InBox                                  {width:100%;height:75px;overflow:visible;}
header hgroup h1                               {width:10%;float:left;text-align:center;padding:13px 0 4px 25px;}
header hgroup #lnb .InBox ul                               {width:100%; display:flex; overflow:hidden;}
header hgroup #lnb .InBox ul li                            {float:left; flex:1;}
header hgroup #lnb .InBox ul li:nth-of-type(2)             {width:40%;}
header hgroup #lnb .InBox ul li a                          {padding:29px 0;font-size:16px;text-align:center;}
header hgroup #lnb .InBox ul li.on a                       {color:#000; border-bottom:2px solid #000;font-weight:bold;}	

header hgroup .book                                        {position:absolute; width:140px; height:75px;  top:0; right:0;}
header hgroup .book a {display:block; font-size:12px; color:#000; text-align: center; padding:30px 0;}
header hgroup .book i{font-size: 25px; margin-right: 5px; margin-top: -5px; position: relative; top: 0px;}

nav                                                 {position:fixed;top:75px;left:0;width:100%;height:0;min-width:1000px;overflow:hidden;transition:0.5s;z-index:-1;}
nav:before                                          {position:absolute;top:0;left:0;width:100%;height:calc(100% - 2px);content:"";display:block;opacity:0.85;z-index:1;}
nav:before                                          {background:#fff;border-top:1px solid #e8e8e8;border-bottom:1px solid #e8e8e8;}
nav &gt; div                                           {position:absolute;width:65%;padding-top:30px;left:50%;transform:translateX(-50%); overflow:visible; display:flex;opacity:0;transition:0.5s ease ;z-index:1;}
nav &gt; div .ttls                                     {width:18%;float:left;margin:25px 0;padding-left:9%;}
nav &gt; div .ttls span                                {font-size:14px;color:#223337;display:block;margin-bottom:5%;}
nav &gt; div .ttls strong                              {font-size:35px;display:block;line-height:1.5;font-family: 'NanumBarunGothicLightSubset';}
nav &gt; div .ttls img                                 {display:block;float:left;}
nav &gt; div .ttls &gt; img                               {width:70%;padding-top:20px;}
nav &gt; div .menus                                    {width:64%;float:left;overflow:hidden;margin-top:25px; padding-top: 2px;}
nav &gt; div .menus img                                {width:287px;height:186px;float:left;}
nav &gt; div .menus div &gt; ul                               {position:relative;top:-5px;}
nav &gt; div .menus div &gt; ul                               {padding-left:5%; text-align:center;}
nav &gt; div .menus div &gt; ul li                            {line-height:1.3;padding-bottom:13px;}
nav &gt; div .menus div &gt; ul li a                          {display:block;overflow:hidden;}
nav &gt; div:not(.gb02) .menus div &gt; ul {display:flex;}
nav &gt; div:not(.gb02) .menus div &gt; ul li {flex:1;} 
nav &gt; div .menus div &gt; ul li a span                     {display:block; line-height:1.5;}
nav &gt; div .menus div &gt; ul li a span.en                  {font-size:15px; color:#000;}
nav &gt; div .menus div &gt; ul li a span.ko                  {color:#9b9b9b;font-size:15px;}
nav &gt; div .menus div &gt; ul li a:hover span.en            {color:#5f8caf; font-weight:bold;}
nav &gt; div .menus div &gt; ul li a:hover span.ko            {color:#000;}
nav &gt; div .menus div h3 {display: block; width:fit-content;}
nav &gt; div .menus div h3 strong {display: block; font-size:16px; margin-bottom:20px; font-weight:bold;}
nav &gt; div .menus div h3 span {display: block; font-size:12px; margin-bottom:10px; color:#000;}
nav &gt; .gb02 .menus &gt; ul li a span.en                {width:300px;}

nav &gt; div .menus div {width:90%;}
nav &gt; div:not(.gb02) .menus div {display:flex;}
nav &gt; div .menus div h3 {display: block; float:left;}
nav &gt; div .menus div h3 ul li a:first-of-type {padding-top:0;}

nav &gt; .gb02 .menus {width:100%; display:flex;}
nav &gt; .gb02 .menus .room_menu {width:14.2895%; flex:1;}
nav &gt; .gb02 .menus .room_menu h3 {display: block; width:fit-content; float:none;}
nav &gt; .gb02 .menus .room_menu h3 strong {display: block; font-size:16px; margin-bottom:20px; font-weight:bold;}
nav &gt; .gb02 .menus .room_menu h3 span {display: block; font-size:12px; margin-bottom:10px; color:#000;}
nav &gt; .gb02 .menus .room_menu ul {padding-left:0;}
nav &gt; .gb02 .menus .room_menu ul a span.en {color:#000; font-size:14px; text-transform: uppercase;}
header a { display: block; }		


/* footer */
/* footer { text-align: center; position: relative; height:100%; overflow: hidden; color: #fff; background-color:#3e3e3e;}
footer .ft_top {background-color:#565656; height:60px; width:100%; position: relative; z-index: 1;}
footer .ft_top ul {width:100%; max-width:800px; margin:0 auto; display:flex;}
footer .ft_top ul li {flex:1; padding:22px 0;}
footer .ft_top ul li span {color:#fff; font-size:15px; }
footer .ft_top ul li:hover span {font-weight:bold;}

footer .wrap {width:100%; height:100%; overflow: hidden; position: relative; border-bottom:1px solid #fff; z-index:2;}
footer .inner {max-width: 1300px; margin: 0 auto; position: relative; display:flex; z-index: 2; padding:30px 0;}
footer .inner img { margin-bottom: 20px; }
footer .inner .ft_info1, .ft_info2 {flex:1.5; text-align:left; font-size:15px; color:#9d9d9d; margin:40px;}
footer .inner .ft_img {flex:1;}
footer .inner ul li {margin:15px 0;}
footer .inner ul li span {color:#e5e5e5; font-size:15px;}

footer .ft_bottom {color:#fff; max-width: 1300px; width:100%; height:100%; overflow: hidden; margin:0 auto;}
footer .ft_bottom .icons {display:flex; float:left; padding:14px 0;}
footer .ft_bottom .icons span, a {display:block; flex:1;}
footer .ft_bottom .icons span {flex:2.5; line-height:4.5; font-size:14px; color:#9d9d9d;}
footer .ft_bottom .icons a {margin:0 13px;}
footer .ft_bottom .ft_resv {float:right; padding:22px 0;}
footer .ft_bottom .ft_resv span {display:inline-block; color:#9d9d9d; font-size:14px; margin-right:10px;}
footer .ft_bottom .ft_resv a {display:inline-block; font-size:15px; color:#fff; padding:15px 30px; border:1px solid #9d9d9d;}

footer .ft_bottom .icons a:hover {filter:drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.5));}
footer .ft_bottom .ft_resv a:hover {filter:drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.5))}

footer .ft_bottom .copyright { margin-top: 20px; font-size: 13px; width:fit-content; line-height:3.5; text-align: center; margin:0 auto;}
footer .ft_bottom .copyright a { color: #fff; font-family: FuturaStd; }
footer .ft_bottom .copyright a:hover { text-decoration: underline;} */

/* header a,footer a 						    {display:block;}  */

/* new footer */
.footer { width: 100%; /* margin-top: 100px; */ background: #fff;}
.footer .wrap { max-width: 1500px; margin: 0 auto; padding: 0 3%; }
.footer .footer_menu {border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 18px 0;}
.footer .footer_menu ul li {display: inline-block; margin-right: 25px;color: #595959; font-size: 14px; font-weight: 100;}
.footer .footer_menu ul li a { color: #595959; }
.footer .footer_menu ul li:last-child {margin-right: 0;}
.footer .footer_menu ul li:hover {font-weight: 500;}
.footer .footer_info {padding: 30px 0; color: #a6a6a6; font-size: 14px; font-weight: 100; overflow: hidden;}
.footer .footer_info .company_info {float: left; max-width: 900px;}
.footer .footer_info .sns {float: left;  opacity: .4; margin-right: 100px; margin-top: -12px;}
.footer .footer_info .sns ul li {display: inline-block; margin-left: 15px;}
.footer .footer_menu ul li:first-child{margin-left: 300px;}
.footer .footer_info .sns i { font-size: 22px; color: #474747; }
.footer .footer_info .company_info ul li {display: inline-block; margin-right: 15px; margin-bottom: 15px;}
.footer .createdBy { margin-top: 15px; }
.footer .createdBy a { color: #a6a6a6; }
.footer .createdBy a:hover { text-decoration: underline; }
.m-call{display: none; position: fixed; top: 8%; left: 5%; font-size: 24px; width: 50px; height: 50px; border-radius: 50%; text-align: center; line-height: 50px;  background-color: #000;}
/* .m-call i{color: #fff;} */
/*------------------------------------------------------------------------------------------------*/
/* Index */
#index .section {margin-top:5.5%;}

#index .visual { margin-top: 0; }

#index .visual-video { width: 100vw; height: 100vh; margin-top: 0; }
#index .visual-video .MyFrame { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 100%; height: 100%; overflow: hidden; } 
#index .visual-video .MyFrame iframe { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
#index .visual-video .MyFrame iframe { min-width: 100%; min-height: 100%; width: auto; height: auto; object-fit: cover; }
#index .visual-video .MyFrame{background: url(http://gonylab9.speedgabia.com/penta/main/index.jpg) 50% 50% no-repeat; background-size: cover; }
/* #index .visual-video .MyFrame::after{content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background: #000; opacity: 10%;} */
/* reserve-bar */
#reserveBar { position: absolute; left: 0; bottom: 0; width: 70%; height: 135px; background: #fff; opacity: .8; box-sizing: border-box; }
#reserveBar form { width: 100%;  height: 100%; margin: 0 auto; box-sizing: border-box; }
#reserveBar form .wrap { width: 100%; height: 100%; display: flex; box-sizing: border-box; }
#reserveBar form .wrap .box { flex: 1; position: relative; text-align: center; box-sizing: border-box; }
#reserveBar form .wrap .box:not(:last-of-type) { padding: 33px 0; }
#reserveBar form .wrap .box::after { content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 50%; background: #bbb; }

#reserveBar form .wrap .box .datepicker-wrap { position: relative; display: inline-block; width: 60%; min-width: 180px; }
#reserveBar form .wrap .box input.datepicker { cursor: pointer; text-align: center; width: 100%; border: none; outline: none; font-size: 18px; }
#reserveBar form .wrap .box .datepicker::placeholder { font-size: 15px; }
#reserveBar form .wrap .box .datepicker-wrap::after { content: "\e942"; position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-family: xeicon; }
#reserveBar form .wrap .box select { cursor: pointer; text-align: center; width: 70%; font-size: 18px; border: none; }
#reserveBar form .wrap .box select:focus { outline: none; }
#reserveBar form .wrap .box select option { font-size: 15px; }

#reserveBar form .wrap .box input[type=submit] { width: 100%; height: 100%; background: #000; outline: none; color: #fff; font-size: 16px; cursor: pointer; border: none; }
#reserveBar form .wrap .box p { color: #555; margin-bottom: 20px; }
#reserveBar form .wrap .box:nth-of-type(4)::after { display: none; }
#reserveBar form .wrap .box:nth-of-type(5)::after { display: none; }


#index .section:first-child {padding-top:0; margin-top:0;}
#index .offers {background-color:#f1f1f1; margin-top:0; padding-top:5.5%; padding-bottom:5.5%;}
#index .offers h3 {display:block; max-width:1300px; margin:0 auto; color:#333;}
#index .offers h3 strong {display:inline-block; text-align:left; font-weight:bold; font-size:30px; margin-right:20px;}
#index .offers h3 span {display:inline-block; text-align:left; font-size:17px;}

#index .offers ul {width:100%; overflow: hidden; height:100%; max-width:1300px; margin:30px auto; display:flex;}
#index .offers ul li {flex:1; margin:0 2.5%}
#index .offers ul li .txt {text-align:center;}
#index .offers ul li .txt strong {display: block; font-weight:bold; font-size:17px; color:#333; margin:30px 0 20px; line-height:1.5;}
#index .offers ul li .txt span {display: block; font-size:15px; line-height:1.75;}
#index .offers ul li .txt a {display:block; background:none; width:fit-content; text-align:center; font-size:16px; margin:30px auto 0;}
#index .offers &gt; div {max-width:1300px;min-width:800px;margin:30px auto 0;} 

#index .offers .InBox {position:relative;margin-bottom:10%;}
#index .offers .InBox .swiper {width:100%;overflow:hidden;}

/* #index .offers .InBox .swiper a {display:block;}
#index .offers .InBox .swiper a .img {max-width:600px;}
#index .offers .InBox .swiper a .txt {width:95%;margin:0 auto;text-align:center;line-height:1.5;}
#index .offers .InBox .swiper a .txt strong {display:block;font-size:1.1vw;font-weight:bold;margin:5% 0 3%;}
#index .offers .InBox .swiper a .txt strong b {font-weight:bold;}
#index .offers .InBox .swiper a .txt strong b.b01 {color:#007488;}
#index .offers .InBox .swiper a .txt strong b.b02 {color:#a58f65;}
#index .offers .InBox .swiper a .txt span {font-size:0.9vw;display:block;color:#838383;}
#index .offers .InBox .swiper a .txt em {display:block;font-size:0.8vw;font-weight:bold;margin-top:5%;} */

#index .list {margin-top:0;}
#index .list::after {content:""; position: absolute; left:0; top:0; width:100%; height:100%; background-color:#000; opacity:0.5;}
#index .list h3 {position: absolute; top:250px; left:7%; transform:translateX(-7%); z-index:50; font-size:50px; color:#fff;}
#index .list .img {position:relative;width:100%;height:100%;}
#index .list .img div {position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;opacity:0;}
#index .list .img div:before {position:absolute;left:0;top:0;width:100%;height:100%;content:"";background:#000;opacity:0.3;}
#index .list ul {position:absolute;width:100%;height:100%;overflow:hidden;z-index:2;}
#index .list ul li {position:relative;float:left;width:25%;height:100%;}
#index .list ul li &gt; div {position:absolute;top:50%;left:10%; transform:translateX(10%); width:100%;height:100%;margin-top:-100px;text-align:left;display:block;overflow:hidden;}
#index .list ul li div strong {font-size:25px;font-family:linotype-didot;display:block;color:#fff;margin-top:50px;transition: 0.5s;}
#index .list ul li div div {width:80px;height:1px;background:#fff; opacity:0.5; width:300px;}
#index .list ul li div span {font-size:15px;line-height:1.8;display:block;color:#fff;opacity:0;transition: 0.5s;}
#index .list ul li div span b {display:block; margin:50px 0 25px;}
#index .list ul li div span a {display:block; color:#fff; width:fit-content; font-size:14px; border:1px solid #fff; padding:5px 25px; margin-top:25px;}

#index .list ul li div:hover strong {font-size:25px; margin:15px 0;}
#index .list ul li div:hover div {opacity:1;}
#index .list ul li div:hover span {opacity:1;}

#index .list .img .i01	{background:url(http://gonylab9.speedgabia.com/penta/main/1.jpg) no-repeat 50% 50%;background-size:cover;}
#index .list .img .i02	{background:url(http://gonylab9.speedgabia.com/penta/main/2.jpg) no-repeat 50% 50%;background-size:cover;}
#index .list .img .i03	{background:url(http://gonylab9.speedgabia.com/penta/main/3.jpg) no-repeat 50% 50%;background-size:cover;}
#index .list .img .i04	{background:url(http://gonylab9.speedgabia.com/penta/main/4.jpg) no-repeat 50% 50%;background-size:cover;}

#index .restaurant {position:relative;width:100%;height:100%;overflow:hidden; display: flex;}
#index .restaurant .main-txt2{width: 24%; position: relative; padding-left: 66px;}
#index .main-txt2 h2{ position: absolute; top: 50%; transform: translateY(-50%);  font-size: 32px; line-height: 55px; text-transform: uppercase;}
#index .main-txt2 span {position: absolute ; bottom: 0; font-size: 16px; color: #848484; line-height: 30px; transform: rotate(90deg);}

#index .restaurant .swiper-view {}
#index .restaurant .Swipers {width: 76%;}
#index .restaurant .swiper-view .InBox {height:90vh;}
#index .restaurant .swiper-container .swiper-wrapper .swiper-slide {transform: scale(0.9); transition: all 0.5s}
#index .restaurant .swiper-container .swiper-wrapper .swiper-slide-active {transform: scale(1); transition: all 0.5s}
#index .restaurant .swiper-container .plays {position:absolute;top:0;right:56px;height:50px;display:block; background-color: #000; z-index:50; display:none;}
#index .restaurant .swiper-container .swiper-pagination {width:fit-content; left:50%; display: none;}
#index .restaurant .swiper-container .swiper-pagination .swiper-pagination-bullet {width:13px; height:13px; background-color:#fff; border-radius:10px; margin:0 3px;}
#index .restaurant .swiper-container .swiper-pagination .swiper-pagination-bullet-active {background-color:transparent; border:1px solid #fff; margin-bottom:-1px;} 
#index .restaurant .swiper-container .title {position: absolute; top:50%; transform:translateY(-50%); width:auto; height:auto; right:50px;}
#index .restaurant .swiper-container .title span {display:block; font-size:17px; color:#fff; text-align: center; line-height:1.75;}
#index .restaurant .swiper-container .title a {display:block; color:#fff; border:1px solid #fff; font-size:14px; margin:30px auto 0; padding:10px 18px; width:fit-content;}
#index .Swipers .swiper-button-prev{position: static !important; transform: translate(0); margin-right: 1px; width: 67px; height: 87px; background: url(../images/prev.jpg) 50% 50% no-repeat; background-size: cover;}
#index .Swipers .swiper-button-next{position: static !important;transform: translate(0); width: 67px; height: 87px; background: url(../images/next.jpg) 50% 50% no-repeat; background-size: cover;}
#index  .swiper-arrow{display: flex;  position: absolute; left: 0; bottom: 0; padding: 1px;  width: 137px; height: 87px; z-index: 100;}
#index .video {padding:6.5% 0; position: relative;}
#index .video::after {position: absolute; background:url(http://gonylab9.speedgabia.com/penta/main/8.jpg) no-repeat 50% 50%; background-size:cover; filter:blur(5px);}
#index .video::after {content:""; top:0; left:0; width:100%; height:100%; z-index:1;}
#index .video .bg {position:absolute; width:100%; height:100%; top:0; left:0; background-color:#000; opacity:0.5; z-index:2;}
#index .video .ttl {width:100%; color:#fff; position: absolute; top:120px; left:50%; transform:translateX(-50%); z-index: 3;} 
#index .video .ttl h3 {font-size:50px;text-align:center;}
#index .video .ttl h3 strong {display:block;}
#index .video .ttl h3 span {display:block;font-size:19px;padding:30px 0;}
#index .video #iframe {max-width:1400px;margin:0 auto;display:block; position: absolute; top:250px; left:50%; transform:translateX(-50%); z-index:3;}

#index .main-txt1{position: relative; width: 100%; padding: 180px 0 180px 340px;  margin-top: 0;}
#index .main-txt1::before{content: ''; position: absolute; top: 23%; left: 0; width: 450px; height: 450px; opacity: .15; background: url(../images/panta-back.png) 50% 50% no-repeat; background-size: cover;}
#index .main-txt1 h2{font-size: 48px; text-transform: uppercase; margin-bottom: 32px;}
#index .main-txt1 p{font-size: 32px; text-transform: uppercase; margin-bottom: 50px;}
#index .main-txt1 span{display: block; font-size: 18px; line-height: 30px;}
#index .fa-direct .main-txt2{width: 0;}
#index .fa-direct .main-txt2 span{left: 0; bottom: 8%;}
#index .fa-direct{position: relative; margin-top: 280px; width: 100%; height: 90vh; display: flex; justify-content: center;}
#index .fa-direct div{width: 42%; }
#index .fa-direct div .MyFrame{width:100%;}
#index .fa-direct .fa-pic{position: relative; background: url(http://gonylab9.speedgabia.com/penta/thumbnail/bottom.jpg) no-repeat 50% 50%;     width: 42%; overflow: hidden; background-size: cover;}
#index .fa-direct .fa-txt1{padding : 170px 0 0 120px; box-sizing: border-box; width: 42%; }
#index .fa-direct .fa-txt1 h2{ font-size: 35px; text-transform: uppercase; line-height: 54px; margin-bottom: 20px;}
#index .fa-direct .fa-txt1 p{ font-size: 16px; line-height: 29px; margin-bottom: 130px;}
#index .fa-direct .fa-txt1 a{display: block; width: 240px; height: 55px; line-height: 55px; text-align: center; font-size: 14px; border: 1px solid rgb(165, 164, 164);}
#index .room-preview{height: 100vh; background-color: #eef0ee; box-sizing: border-box; padding: 100px 0 110px;}
#index .room-preview .Swipers{width: 100%; margin: 0 auto; overflow: visible;}
#index .room-preview .Swipers .InBox{height: 23vw;}
#index .room-preview .Swipers .InBox .swiper-slide{}
/* #index .room-preview .swiper-slide-active{transform: translateY(10px); transition: .5s;} */
#index .room-preview .room-priv-txt{position: absolute; bottom: -255px; width: 100%; height: auto; text-align: center;}
#index .room-preview .room-priv-txt p:first-child{font-size: 32px; margin-bottom: 12px;}
#index .room-preview .room-priv-txt p:nth-child(3){font-size: 16px; }
#index .room-preview .room-priv-txt div{width: 20%; height: 1px; background: #b6b6b6; margin: 50px auto 0px;}
#index .room-preview .room-priv-txt a{font-size: 20px;  text-transform: uppercase; display: block; padding: 30px 20px;}
#index .room-preview  .swiper-arrow{left: 50%; transform: translateX(-50%); bottom: -400px; justify-content: space-around;  width: 50%;margin: 0 auto;}
#index .room-preview .Swipers .swiper-button-prev{margin-right: 0; background-image: url(../images/prev2.jpg); width: 50px; height: 50px;}
#index .room-preview .Swipers .swiper-button-next{margin-right: 0;background-image: url(../images/next2.jpg); width: 50px; height: 50px;}
#index .room-preview .Swipers .swiper-pagination{bottom: -341px;}
#index .room-preview .Swipers .swiper-pagination .swiper-pagination-bullet{background: #cdcfcd; margin: 0 1px; width: 46px ; height: 2px;}
#index .room-preview .Swipers .swiper-pagination .swiper-pagination-bullet-active{background: #000;}

.room-type{font-size: 13px ; margin-bottom: 27px;}
@keyframes txt-ani{
  0%{ transform: translateY(80px); opacity: 0;}
  100%{transform: translateY(0px); opacity: 1;}
}
@keyframes txt-ani2{
  0%{ transform: translateY(80px) rotate(90deg); opacity: 0;}
  100%{transform: translateY(0px) rotate(90deg); opacity: 1;}
}
@keyframes txt-ani3{
  0%{ transform: translateX(-80px) ; opacity: 0;}
  100%{transform: translateX(0px) ; opacity: 1;}
}
@keyframes txt-ani4{
  0%{ transform: translateX(80px) ; opacity: 0;}
  100%{transform: translateX(0px) ; opacity: 1;}
}
.moving1 h2,.moving1 p{opacity: 0; transform: translateY(80px);}
.moving1 span{opacity: 0; transform: translateY(80px);}
.moving2{opacity: 0; transform: translateY(80px) rotate(90deg);}
.moving3{opacity: 0; transform: translateX(-80px) ;}
.moving4 h2,.moving4 p,.moving4 a{opacity: 0; transform: translateX(80px) ;}
.moving5{opacity: 0; transform: translateY(80px) rotate(90deg);}
.moving1.on h2,.moving1.on p{animation: txt-ani; animation-duration: .5s;animation-fill-mode: forwards; }
.moving1.on span{animation: txt-ani; animation-duration: .9s;animation-fill-mode: forwards;}
.moving2.on{animation: txt-ani2; animation-duration: .5s;animation-fill-mode: forwards; }
.moving3.on{animation: txt-ani3; animation-duration: .5s;animation-fill-mode: forwards; }
.moving4.on h2{animation: txt-ani4; animation-duration: .4s;animation-fill-mode: forwards; }
.moving4.on p{animation: txt-ani4; animation-duration: .9s;animation-fill-mode: forwards; }
.moving4.on a{animation: txt-ani4; animation-duration: 1.3s;animation-fill-mode: forwards; }
.moving5.on{animation: txt-ani2; animation-duration: .5s;animation-fill-mode: forwards; }
/*------------------------------------------------------------------------------------------------*/
/* Introduton */
#introduction #contents{text-align: center; padding: 100px 0;}
#introduction #contents h2{font-size: 40px; margin-bottom: 80px;}
#introduction #contents div{display: flex; justify-content: center;}
#introduction #contents div p{ line-height: 30px; font-size: 18px;}
#introduction #contents div p:first-child{width: 30%; height: 500px; background: url(../images/intro1.png) 50% 50% no-repeat; background-size: cover;}
/*------------------------------------------------------------------------------------------------*/

/* media */
#media .offers {margin-top:0; padding-top:5.5%; padding-bottom:5.5%;}
#media .offers h3 {display:block; max-width:1300px; margin:0 auto; color:#333;}
#media .offers h3 strong {display:block; text-align:center; font-weight:bold; font-size:30px; margin-bottom:10px;}
#media .offers h3 span {display:block; text-align:center; font-size:17px; margin-bottom:50px;}
#media .offers &gt; ul {width:100%; overflow: hidden; height:100%; max-width:1300px; margin:30px auto; display:flex;}
#media .offers &gt; ul li {flex:1; margin:0 2.5%}
#media .offers &gt; ul li .txt {text-align:center; border:1px solid #eaeaea;}
#media .offers &gt; ul li .txt strong {display: block; font-weight:bold; font-size:17px; color:#333; padding:30px 0 20px; line-height:1.5;}
#media .offers &gt; ul li .txt span {display: block; font-size:15px; line-height:1.75;}
#media .offers &gt; ul li .txt a {display:block; background:none; width:fit-content; text-align:center; font-size:16px; margin:30px auto 20px; height:fit-content; border:1px solid #eaeaea; padding:15px 20px; height:fit-content;}

/*------------------------------------------------------------------------------------------------*/
/* Location */
.loca-mb{display: none;}
#location .video .MyFrame{background: url(http://gonylab9.speedgabia.com/penta/location/thumb.jpg) 50% 50% no-repeat; background-size: cover; }

#location #contents{text-align: center; padding: 100px 0;}
#location #contents h2{font-size: 40px; margin-bottom: 80px; margin-top: 80px;}
#location #contents .intro-div{display: flex; justify-content: center; margin-bottom: 120px;}
#location #contents .intro-div p{ line-height: 30px; font-size: 14px; margin: 0 60px;}
#location #contents .intro-div p:nth-child(2){width: 30%; height: 500px; background: url(../images/intro1.png) 50% 50% no-repeat; background-size: 100% 100%;}

#location #contents {padding-top:3%;}
#location .location h3 {position:relative;margin-top: 120px; text-align:center;right:0;padding:6% 0 3%;width:100%;height:30px;z-index:1;}
#location .location h3 strong {display: block; font-size:30px;}
#location .location {max-width:1200px; padding-bottom:3%;margin:0 auto;overflow:hidden;}
#location .location &gt; div {width:90%;margin:0 auto; }
#location .location .txt {margin-top:40px; border-top:1px solid #333; padding:40px;}
#location .location .txt p em {display:inline-block; font-size:16px; width:130px; font-weight:bold;}
#location .location .txt &gt; span {font-size:15px;line-height:1.5;padding:7% 0 10%;display:block;}
#location .location .txt p {margin-bottom:3%;}
#location .location .txt p strong {display:block;font-size:16px;color:#afafaf;margin-bottom:3px;}
#location .location .txt p span {display:inline-block;line-height:1.7;font-size:16px;color:#101010;}
#location .location .metro { border-top:1px solid #dadada; border-bottom:1px solid #dadada; padding:40px; position: relative;}
#location .location .metro em {display:inline-block; font-size:16px; width:130px; font-weight:bold; position: relative; top:-20px;}
#location .location .metro a {position: relative; width:130px; height:50px; display:inline-block; letter-spacing:1px; background:#58939d; overflow: hidden;}
#location .location .metro a.btn div.back {position:absolute;top:0;left:0;width:100%;height:100%;background:#007488;transition: 0.5s;}
#location .location .metro a.btn div.mask {position:relative;padding-top:20px;}
#location .location .metro a.btn div.mask div {height:15px;overflow:hidden;}
#location .location .metro a.btn div.mask div span	{text-align:center;display:block;color:#fff;font-size:15px;font-family:'FuturaStd-Book','nanumbarungothicregular', 돋움, Dotum, sans-serif;}
#location .location .metro a.btn div.mask div span	{transition:transform 0.5s cubic-bezier(.65,0,.35,1)}
#location .location .metro a.btn:hover div.back {top:100%;}
#location .location .metro a.btn:hover div.mask span {transform: translateY(-100%)}

#location .travel {max-width:1400px;padding:7.5% 0;margin:0 auto;overflow:hidden;border-top:1px solid #e8e8e8;}
#location .travel h4 {text-align:center;margin-bottom:5%;line-height:1.5;}
#location .travel h4 strong {display:block;font-size:17px;}
#location .travel h4 span {display:block;font-size:50px;}

#location .travel ul {overflow:hidden;}
#location .travel ul li {width:50%;margin:0 0 7.5%;min-height:450px;float:left;text-align:center;}
#location .travel ul li img {width:90%;margin:0 auto 5%;display:block;}
#location .travel ul li strong {display:block;font-size:1.7vw;}
#location .travel ul li em {display:block;padding:2% 0 2.5%;font-size:0.9vw;}
#location .travel ul li span {display:block;font-size:0.8vw;line-height:1.5;width:95%;margin:0 auto;}

.room-map::after{content: ''; margin: 0 auto 150px; width: 70%; height: 42vw; background: url(/images/room-map.jpg) 50% 50% no-repeat; background-size: cover;  display: block;}
/*------------------------------------------------------------------------------------------------*/
/* travel ----------------------------*/
#travel .video .MyFrame{background: url(http://gonylab9.speedgabia.com/penta/travel/thumb.jpg) 50% 50% no-repeat; background-size: cover; }

.sub .section:first-child h2{ opacity: .8;   position: absolute;top: 50%;left: 50%;transform: translate(-50%);z-index: 1; font-size: 50px;color: #fff;}
#travel #contents{text-align: center; padding: 100px 0;}
#travel #contents h2{font-size: 40px; margin-bottom: 80px; margin-top: 100px;}
#travel #contents .intro-div{display: flex; justify-content: center; margin-bottom: 120px;}
#travel #contents .intro-div p{ line-height: 30px; font-size: 14px; margin: 0 30px;}
#travel #contents .intro-div p:first-child{width: 30%; height: 500px; background: url(../images/intro1.png) 50% 50% no-repeat; background-size: 100% 100%;}

#travel .contents h3 {text-align:center;margin-bottom:2%;line-height:1.5;padding-top:70px;}
#travel .contents h3 span {display:block;font-size:17px;}
#travel .contents h3 strong {display:block;font-size:50px;}
#travel .contents .frame ul {max-width:1400px; margin:0 auto; overflow:hidden; display: flex; flex-wrap: wrap;}
#travel .contents .frame ul li {width:31.3333%;margin:0 1% 5%;line-height:1.5;text-align:center;}
#travel .contents .frame ul li img {display:block;}
#travel .contents .frame ul li strong {display:block;font-size:24px;margin-top:20px;}
#travel .contents .frame ul li em {display:block;margin:10px 0 20px;font-size:18px;}
#travel .contents .frame ul li span {display:block;font-size:15px; text-align: left;}
/*------------------------------------------------------------------------------------------------*/

/* Detail */
#rooms .slide_02{height: 45vw !important;}
.detail #banner {height:800px;min-height:562px;overflow:hidden;}	
.detail #banner:before {position:absolute;top:0;left:0;width:100%;height:100%;opacity:0.2;background:#000;content:"";}
.detail .section:first-child h2 {position:absolute;top:50%;left:50%;transform:translate(-50%);text-transform: uppercase; letter-spacing: 5px; z-index:1; font-size:50px; color:#fff; width:fit-content;}

.detail #contents {background:#fff;}
.detail #contents &gt; .txt {max-width:1400px;padding:7.5% 25px;margin:0 auto;color:#a6aba1;border-bottom:1px solid #e8e8e8;}
.detail #contents &gt; .txt span {display:block;font-size:30px;font-family:athelas,serif;margin-bottom:2%; text-align: center;}
.detail #contents &gt; .txt p {line-height:200%;font-size:15px; text-align: center; color:#333;}

.detail #contents &gt; .InnerBox {width:100%;}
.detail #contents &gt; .InnerBox .slides {padding:5.5% 0 8.5%;}
.detail #contents &gt; .InnerBox .slides .info {max-width:1300px;padding:0 25px 2.5%;margin:0 auto;overflow:hidden;}
.detail #contents &gt; .InnerBox .slides .info &gt; h3 {width:fit-content; margin:60px auto;}
.detail #contents &gt; .InnerBox .slides .info &gt; h3 span {color:#bec2ba;display:inline-block;font-size:20px;}
.detail #contents &gt; .InnerBox .slides .info &gt; h3 span {margin-top:10px;}
.detail #contents &gt; .InnerBox .slides .info &gt; h3 strong {color:#70756b;display:inline-block;font: size 20px;font-weight:bold; margin-right:12px;}

.detail #contents &gt; .InnerBox .slides .info &gt; div {position: relative;  height:100%; overflow: hidden; margin-top:50px; padding:50px 0 25px; border-top:1px solid #565656; border-bottom:1px solid #ddd;}
.detail #contents &gt; .InnerBox .slides .info &gt; div b {display:block; float: left; width:130px; font-size:17px; font-weight:500; position: relative; top:7px;}
.detail #contents &gt; .InnerBox .slides .info &gt; div ul {flex:1; height:100%; overflow: hidden; width: 70%; margin: 0 auto; }
.detail #contents &gt; .InnerBox .slides .info &gt; div ul li {display: flex; margin-bottom:2%;line-height:1.5;overflow:hidden; font-size:15px;}
.detail #contents &gt; .InnerBox .slides .info &gt; div ul li strong {display:block;height:10px;color:#000; width: 10%;font-weight:bold;}
.detail #contents &gt; .InnerBox .slides .info &gt; div ul li span {display:block; width: 85%; line-height: 30px;}

.detail #contents &gt; .InnerBox .eq .txt strong {font-size:25px;color:#333;display:block;margin-bottom:2%;}
.detail #contents &gt; .InnerBox .eq {padding:0% 0px 5%;margin:0 auto;overflow:hidden;}
.detail #contents &gt; .InnerBox .eq .txt {float:left;width:29%; margin-left:8%;}
.detail #contents &gt; .InnerBox .eq .txt &gt; div.t01 {padding-top:5%;}
.detail #contents &gt; .InnerBox .eq .txt &gt; div.t01 li {font-size:16px;line-height:1.3;margin-bottom:2%;color:#060606;}
.detail #contents &gt; .InnerBox .eq .txt &gt; div.t02 {padding-top:3%;}
.detail #contents &gt; .InnerBox .eq .txt &gt; div.t02 ul {overflow:hidden;width:100%;line-height:1.8;}
.detail #contents &gt; .InnerBox .eq .txt &gt; div.t02 ul li {font-size:15px;color:#181818;float:left;}
.detail #contents &gt; .InnerBox .eq .txt &gt; div.t02 ul li {padding:0 0 0 20px;background:url(../images/blt.gif) no-repeat left 10px;}
.detail #contents &gt; .InnerBox .eq .txt &gt; div.t02 ul li {width:calc(33.33% - 20px);}
.detail #contents &gt; .InnerBox .eq .txt &gt; div.t02 ul {margin-bottom:35px;}
.detail #contents &gt; .InnerBox .eq .txt &gt; div.t02 p {color:#000; text-transform: uppercase; font-size: 32px; padding: 30% 0; line-height: 55px;}
.detail #contents &gt; .InnerBox .eq .txt &gt; div.t02 span{position: absolute;    font-size: 16px; color: #848484;line-height: 30px;transform: rotate(90deg); color: #b4b4b4;}
.detail #contents &gt; .InnerBox .eq .img {float:left;width:57.5%;}

.reserve-btn{display: flex; justify-content: center;}
.reserve-btn a{display: block; cursor: pointer; width: 270px; height: 57px; font-size: 16px; margin: 50px 30px; text-align: center; line-height: 57px; border: 1px solid #bec2ba; }
.reserve-btn a:last-child{background-color: #a0908f; color: #fff;}

.blueprint{display: none; z-index: 1000;  position: fixed; top: 50%; left: 50%; transform: translate(-50% , -50%); border: 1px solid rgb(70, 69, 69); cursor: pointer; width: 80%; height: 30vw; padding-top: 50px; background-color: #000; background: url(http://gonylab9.speedgabia.com/penta//room/1/0.png) 50% 0% no-repeat rgba(238, 240, 238, .9); background-size: 100% 100%;}
.blueprint i{font-size: 30px; position: absolute; right: 2%; top: 2%;}
/*------------------------------------------------------------------------------------------------*/
/* Facility preview */
#fpv .special {padding:5% 0;}
#fpv .special &gt; div {margin-bottom:3%;height:100%;overflow:hidden;}
#fpv .special &gt; div &gt; div {position:relative;height:100%;float:left;overflow:hidden;transition:0.7s ease-in-out;opacity:0;}
#fpv .special &gt; div &gt; div.txt {width:30%;}
#fpv .special &gt; div &gt; div.txt &gt; div {max-width:300px;min-width:200px;max-height:300px;min-height:200px;margin:calc(50% - 50px) auto 0;}
#fpv .special &gt; div &gt; div.txt &gt; div h3 {font-size:30px;font-weight:bold;letter-spacing:-0.5px;}
#fpv .special &gt; div &gt; div.txt &gt; div p {font-size:0.9vw;line-height:1.5;padding:8.5% 0;width:100%;}

#fpv .special &gt; div &gt; div.img {width:70%;}
#fpv .special &gt; div &gt; div.img img {display:block;transform: scale(1);transition:0.5s;}


/*------------------------------------------------------------------------------------------------*/
/* Special */
/* #facility .video .MyFrame{background: url(http://gonylab9.speedgabia.com/penta/facility/thumb.jpg) 50% 50% no-repeat; background-size: cover; } */

.special #banner {height:95vh;min-height:562px;overflow:hidden;}	
.special #banner:before {position:absolute;top:0;left:0;width:100%;height:100%;opacity:0.2;background:#000;content:"";}
.special .section:first-child h2 {position:absolute;top:50%;left:50%;transform:translate(-50%);z-index:1; font-size:50px; color:#fff;}

.special #contents {background:#fff;}
.special #contents &gt; .txt {max-width:1400px;padding:7.5% 25px;margin:0 auto;color:#a6aba1;}
.special #contents &gt; .txt span {display:block;font-size:33px;margin-bottom:2%; text-align: center; color:#000;}
.special #contents &gt; .txt p {line-height:200%;font-size:14px; text-align: center; color:#333;}

.special #contents &gt; .InnerBox {width:100%;}
.special #contents &gt; .InnerBox .slides {padding:0;}
.special #contents &gt; .InnerBox .slides .info {max-width:1400px;padding:1.5% 25px 6%;margin:0 auto;overflow:hidden;}
.special #contents &gt; .InnerBox .slides .info &gt; strong {display:block;font-size:18px;color:#c4c4c4;margin-bottom:2%;}
.special #contents &gt; .InnerBox .slides .info &gt; p {line-height:1.5;font-size:17px;}
.special #contents &gt; .InnerBox .slides .img {position:relative;height:95vh;min-height:562px;overflow:hidden;}	
.special #contents &gt; .InnerBox .slides .img:before {position:absolute;top:0;left:0;width:100%;height:100%;opacity:0.3;background:#000;content:"";}
.special #contents &gt; .InnerBox .slides .img .txt {position:absolute;top:50%;z-index:2;}
.special #contents &gt; .InnerBox .slides .img .txt p {color:#fff;line-height:1.5;margin-top:5%;}

#facility #contents &gt; .InnerBox .slides .img .txt {right:5%;text-align:right;}
#food #contents &gt; .InnerBox .slides .img .txt {left:5%;text-align:left;}

#food .restaurant {height:80vh;min-height:500px;}
#food .restaurant ul {height:100%;overflow:hidden;}
#food .restaurant ul li {width:calc(25% - 1px);float:left;height:100%;margin:0 0.5px;}
#food .restaurant ul li a {position:relative;display:block;width:100%;height:100%;overflow:hidden;}
#food .restaurant ul li a div {position:absolute;top:0;left:0;width:100%;height:100%;transform: scale(1);transition:0.5s;}
#food .restaurant ul li a div:before {position:absolute;top:0;left:0;width:100%;height:100%;content:"";opacity:0.2;background:#fff;transition:0.5s;}
#food .restaurant ul li a:hover div {transform: scale(1.03);}
#food .restaurant ul li a:hover div:before {opacity:0;}
#food .InnerBox ul:nth-child(2) {display:flex;}
#food .InnerBox ul:nth-child(2) li {flex:1;}

#food #contents &gt; .InnerBox .slides .info {max-width:1300px;margin:0 auto;}
#food #contents &gt; .InnerBox .slides .info &gt; div:first-child {width:100%;float:none;margin:0 0 5%;overflow:hidden;}
#food #contents &gt; .InnerBox .slides .info &gt; div:first-child img {display:block;float:left;width:49%;margin:0 0.5%;}
#food #contents &gt; .InnerBox .slides .info &gt; div {width:90%;margin:0 auto;}
#food #contents &gt; .InnerBox .slides .info &gt; div &gt; strong {display:block;font-size:18px;color:#c4c4c4;margin-bottom:3.5%;padding-left:2%;}
#food #contents &gt; .InnerBox .slides .info &gt; div &gt; span {display:block;font-size:17px;font-weight:bold;margin-bottom:2%;padding-left:2%;}
#food #contents &gt; .InnerBox .slides .info &gt; div &gt; p {line-height:1.5;font-size:16px;margin-bottom:5%;padding-left:2%;}

#food #contents &gt; .InnerBox .slides .info div ul li a.btn 	{position:relative;width:150px;height:50px;display:block;letter-spacing:1px;background:#58939d;overflow:hidden;}
#food #contents &gt; .InnerBox .slides .info div ul li a.btn div.back {position:absolute;top:0;left:0;width:100%;height:100%;background:#007488;transition: 0.5s;}
#food #contents &gt; .InnerBox .slides .info div ul li a.btn div.mask {position:relative;padding-top:17px;}
#food #contents &gt; .InnerBox .slides .info div ul li a.btn div.mask div {height:23px;overflow:hidden;}
#food #contents &gt; .InnerBox .slides .info div ul li a.btn div.mask div span	{text-align:center;float:none;display:block;color:#fff;font-size:15px;font-family:'FuturaStd-Book','nanumbarungothicregular', 돋움, Dotum, sans-serif;}
#food #contents &gt; .InnerBox .slides .info div ul li a.btn div.mask div span	{transition:transform 0.5s cubic-bezier(.65,0,.35,1)}
#food #contents &gt; .InnerBox .slides .info div ul li a.btn:hover div.back {top:100%;}
#food #contents &gt; .InnerBox .slides .info div ul li a.btn:hover div.mask span {transform: translateY(-100%); float:none;}

/*------------------------------------------------------------------------------------------------*/
/* Table */
.section .snb {width:400px;margin:0 auto;padding:35px 0;margin-bottom:3%;overflow:hidden;}
.section .snb li {text-align: center; font-size: 35PX;}
#reserve .section .snb{display: flex;}
#reserve .section .snb li{width: 33.3333%;}
/* .section .snb li {float:left;width:50%;background:url(../images/pv_b.gif) no-repeat right center;} */
/* .section .snb li:last-child {background:none;} */
.section .snb li a {display:block;padding:15px 0;text-align:center;font-size:17px;}
.section .snb li.active a {font-weight:bold;}
.section:first-child h2{  letter-spacing: 45px;  position: absolute;top: 50%;left: 50%;transform: translate(-50%);z-index: 1;font-size: 50px;color: #fff;}
.table #contents .InnerBox {max-width:1300px; padding:3% 0;margin:0 auto;}
.table #contents .thumb {position:relative;max-width:1300px;margin:0 auto;}
.table #contents .thumb h3 {width:98%;margin:0 auto;font-size:35px;}
.table #contents .thumb h3 strong {display:block;}
.table #contents .thumb h3 span {display:block;font-size:15px;padding:15px 0;}
.table #contents .thumb iframe {display:block;margin-top:10px;padding-top:10px;border-top:1px solid #000;}
.table .section .snb{display: flex;}
.table .section .snb li{width: 50%;}
.table .section .snb li~li{border-left: 1px solid #e8e8e8;}
#offers #contents .bd_menu {position:relative;max-width:1300px;margin:0 auto;}
#offers #contents .stb {position:absolute;top:120px;left:15px;overflow:hidden;z-index:100;}
#offers #contents .stb li {float:left;margin:0 5px;border:1px solid #e8e8e8;}
#offers #contents .stb li:last-child {background:none;}
#offers #contents .stb li a {display:block;padding:12.5px 15px;width:100px;text-align:center;font-size:15px;}
#offers #contents .stb li.active a {color:#fff;background:#a58f65;}
#offers #contents .thumb iframe {padding-top:100px;}
#offers .wrap {width:100%; height:100%; overflow: hidden; position: relative;}


/* Reserve */
/* #reserve .section:first-child h2{   position: absolute;top: 50%;left: 50%;transform: translate(-50%); z-index: 1; font-size: 50px;color: #fff;} */
#reserve .tab_02 {display:none;}
#reserve .tab_02 h2 {width:250px;margin:0 auto;padding:0px 0 35px;}
#reserve .tab_02 table {width:100%;border:1px solid #e7e7e7;font-family:'돋움',Dotum!important;}
#reserve .tab_02 table tr th {border-right:1px solid #e7e7e7;border-bottom:1px solid #e7e7e7;}
#reserve .tab_02 table tr th,
#reserve .tab_02 table tr td {border-right:1px solid #e7e7e7;     border-bottom:1px solid #e7e7e7;text-align:center;font-size:13px;color:#676767;}
.r_info_01 th{width: 10%;}
#reserve .tab_02 &gt; div &gt; h3 {margin-bottom:10px;}
#reserve .tab_02 ul li {padding-left:10px;font-size:12px;line-height:1.6em;color:#676767;font-family:'돋움',Dotum!important;}
#reserve .tab_02 ul li {background:url(http://gonylab2.speedgabia.com/common/li_b.gif) no-repeat left 3px;}
#reserve .tab_02 ul li span {color:#ee3939;}
#reserve .tab_02 .r_info_01 {position:relative;margin-bottom:30px;}
#reserve .tab_02 .r_info_01 h4 {text-align:left;margin-bottom:10px;margin-left:1%;}
#reserve .tab_02 .r_info_01 p{font-size:12px;margin-bottom:7px;vertical-align:center;color:#676767;font-family:'돋움',Dotum!important;background:url(http://gonylab2.speedgabia.com/common/li_b.gif) no-repeat left center;padding-left:10px;}
#reserve .tab_02 .r_info_01 table {margin-bottom:20px;}
#reserve .tab_02 .r_info_01 table .room_ {background:#efefef;height:50px;}
#reserve .tab_02 .r_info_01 table &gt; thead {line-height:1.1em;}
#reserve .tab_02 .r_info_01 table &gt; thead {background:#f8f8f8;}
#reserve .tab_02 .r_info_01 table &gt; thead tr th {font-weight:bold;}
#reserve .tab_02 .r_info_01 table &gt; tbody tr td {line-height:3em;}
#reserve .tab_02 .r_info_02 {margin:50px 0;padding-top:50px;text-align:left;} 
#reserve .tab_02 .r_info_03 {text-align:left;}
#reserve .tab_02 .r_info_03 .CNCL_COMM {margin-bottom:50px;}
#reserve .tab_02 .r_info_03 table {line-height:1.5em;margin-top:20px;}
#reserve .tab_02 .r_info_03 table &gt; thead {background:#f2f2f2;}

#reserve-220613 .tab_02 {display:none;}
#reserve-220613 .tab_02 h2 {width:250px;margin:0 auto;padding:0px 0 35px;}
#reserve-220613 .tab_02 table {width:100%;border:1px solid #e7e7e7;font-family:'돋움',Dotum!important;}
#reserve-220613 .tab_02 table tr th {border-right:1px solid #e7e7e7;border-bottom:1px solid #e7e7e7;}
#reserve-220613 .tab_02 table tr th,
#reserve-220613 .tab_02 table tr td {border-right:1px solid #e7e7e7;border-bottom:1px solid #e7e7e7;text-align:center;font-size:13px;color:#676767;}
#reserve-220613 .tab_02 &gt; div &gt; h3 {margin-bottom:10px;}
#reserve-220613 .tab_02 ul li {padding-left:10px;font-size:12px;line-height:1.6em;color:#676767;font-family:'돋움',Dotum!important;}
#reserve-220613 .tab_02 ul li {background:url(http://gonylab2.speedgabia.com/common/li_b.gif) no-repeat left 3px;}
#reserve-220613 .tab_02 ul li span {color:#ee3939;}
#reserve-220613 .tab_02 .r_info_01 {position:relative;margin-bottom:30px;}
#reserve-220613 .tab_02 .r_info_01 h4 {text-align:left;margin-bottom:10px;margin-left:1%;}
#reserve-220613 .tab_02 .r_info_01 p{font-size:12px;margin-bottom:7px;vertical-align:center;color:#676767;font-family:'돋움',Dotum!important;background:url(http://gonylab2.speedgabia.com/common/li_b.gif) no-repeat left center;padding-left:10px;}
#reserve-220613 .tab_02 .r_info_01 table {margin-bottom:20px;}
#reserve-220613 .tab_02 .r_info_01 table .room_ {background:#efefef;height:50px;}
#reserve-220613 .tab_02 .r_info_01 table &gt; thead {line-height:1.1em;}
#reserve-220613 .tab_02 .r_info_01 table &gt; thead {background:#f8f8f8;}
#reserve-220613 .tab_02 .r_info_01 table &gt; thead tr th {font-weight:bold;}
#reserve-220613 .tab_02 .r_info_01 table &gt; tbody tr td {line-height:3em;}
#reserve-220613 .tab_02 .r_info_02 {margin:50px 0;padding-top:50px;text-align:left;} 
#reserve-220613 .tab_02 .r_info_03 {text-align:left;}
#reserve-220613 .tab_02 .r_info_03 .CNCL_COMM {margin-bottom:50px;}
#reserve-220613 .tab_02 .r_info_03 table {line-height:1.5em;margin-top:20px;}
#reserve-220613 .tab_02 .r_info_03 table &gt; thead {background:#f2f2f2;}

.room_9,.room_10{display: none;}

/* rooms add_231012 */
div.water_wrap{width:70%; margin:0 auto; padding:1rem;}
div.water_wrap h2{margin-bottom:1rem; font-size:16px; font-weight:600}
div.water_wrap p{margin-top:1rem; margin-left:1rem; word-break:keep-all;}
.water_wrap table {width:100%; border-collapse:collapse; font-size:15px;}
.water_wrap table th{background-color:#353535; border-right:1px solid #b9b9b9; color:#fff; padding:1rem}
.water_wrap table th:last-child{border-right:0;}
.water_wrap table td{border:1px solid #b9b9b9; border-width:0 1px 1px 0;padding:1rem; text-align:center;}
.water_wrap table td:last-child{border-right:0;}


@media(max-width:1024px) {
  header {display:none;}   
  #header {display:block;}
  #header 											              {position:relative;width:100;z-index:1000;}
  #header hgroup                                                   {position:relative;width:100%;}
  #header hgroup h1                                                {position:absolute;top:10px;left:50%; transform:translateX(-50%);}
  #header hgroup h1 a {width:100px; height:120px; /*background:url(../images/logo_m.png) no-repeat 50% 50%; background-size:cover;*/}
  #header hgroup ul                                                {position:absolute;top:10px;right:10px;}
  #header hgroup ul li                                             {float:left;}
  #header hgroup ul li:nth-child(1)                                {padding:5px 0;}
  #header hgroup ul li:nth-child(1) a {width:39px; height:40px; /*background:url(../images/hd_top_menu.png) no-repeat 50% 50%; background-size:cover;*/}
  #media #header hgroup h1 a {background:url(../images/logo_black.png) no-repeat 50% 50%;}
  #media #header hgroup ul li:nth-child(1) a {background:url(../images/hd_top_menu_black.png) no-repeat 50% 50%;}

 #header #nav                                                             {position:fixed;top:-100%;width:100%;height:100%;z-index:100;}
 #header #nav                                                             {transition:0.7s;overflow:hidden;overflow-y:scroll;opacity:0;}
 #header #nav .InBox														{position:relative;top:0;left:0;width:100%;height:100%;overflow:hidden;}/* overflow-y:scroll; */
 #header #nav .InBox &gt; div                                                {position:relative;height:100%;float:left;}
 #header #nav .InBox &gt; div.gnv											{width:40%;background:#000;}
 #header #nav .InBox &gt; div.gnv &gt; .menu                                    {width:100%;height:100%;}
 #header #nav .InBox &gt; div.gnv &gt; .menu &gt; div                              {position:relative;padding:25% 0 0 10%;width:90%;background:#000;}
 #header #nav .InBox &gt; div.gnv &gt; .menu &gt; div .side                        {width:90%;margin:0 auto 20%;}
 #header #nav .InBox &gt; div.gnv &gt; .menu &gt; div .side a                      {color:#fff;display:block;font-size:18px;line-height:1.5;margin-bottom:3%;transition:0.3s;}
 #header #nav .InBox &gt; div.gnv &gt; .menu &gt; div ul                           {width:85%;margin:0 auto;}
 #header #nav .InBox &gt; div.gnv &gt; .menu &gt; div ul li                        {line-height:4.5}
 #header #nav .InBox &gt; div.gnv &gt; .menu &gt; div ul li a                      {color:#fff;display:block;transition:0.3s;font-size:13px;}
 #header #nav .InBox &gt; div.gnv &gt; .menu &gt; div ul li.on a                   {color:#fff;}


 #header #nav .InBox &gt; div.gnb											{width:60%;}
 #header #nav .InBox &gt; div.gnb &gt; div                                      {position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;z-index:0;}
 #header #nav .InBox &gt; div.gnb &gt; div &gt; div.nv                             {position:relative;width:100%;height:100%;z-index:1;}
 #header #nav .InBox &gt; div.gnb &gt; div &gt; div.nv &gt; div                       {width:80%;transform:translateY(0%);opacity:1;}
 #header #nav .InBox &gt; div.gnb &gt; .gb00                                    {opacity:1;z-index:10;}	
 #header #nav .InBox &gt; div.gnb &gt; .gb00 img								{position:absolute;top:50%;left:50%;margin:-68px 0 0 -140px;z-index:5;}
 #header #nav .InBox &gt; div.gnb &gt; .GnbRoom div.nv &gt; div                    {margin:0 auto;padding-top:25%;height:70%;}
 #header #nav .InBox &gt; div.gnb &gt; .GnbRoom div.nv &gt; div h3                 {color:#fff;margin-bottom:15%;letter-spacing:1px;font-size:25px; font-weight:bold;}
 #header #nav .InBox &gt; div.gnb &gt; .GnbRoom div.nv &gt; div &gt; ul               {width:100%;}
 #header #nav .InBox &gt; div.gnb &gt; .GnbRoom div.nv &gt; div &gt; ul &gt; li          {width:100%; margin-bottom:21px;}
 #header #nav .InBox &gt; div.gnb &gt; .GnbRoom div.nv &gt; div &gt; ul &gt; li &gt; a      {font-size:14px;margin-bottom:1%;color:#fff;}
 #header #nav .InBox &gt; div.gnb &gt; .GnbRoom div.nv &gt; div &gt; ul &gt; li &gt; a img	{position:relative;top:-5px;margin-left:5px;}
 #header #nav .InBox &gt; div.gnb &gt; .GnbRoom div.nv &gt; div &gt; ul &gt; li	ul      {width:95%;height:0;margin:0 auto;padding-bottom:5%;overflow:hidden;opacity:0;transition:0.5s;}
 #header #nav .InBox &gt; div.gnb &gt; .GnbRoom div.nv &gt; div &gt; ul &gt; li	ul li   {line-height:1.8;margin:5px 0;}
 #header #nav .InBox &gt; div.gnb &gt; .GnbRoom div.nv &gt; div &gt; ul &gt; li	ul li a {color:#fff;font-size:17.5px;padding:5px 0;}

 #header #nav .InBox &gt; div.gnb &gt; div.GnbNav &gt; div.nv &gt; div 				{position:absolute;top:10%;left:10%;}
 #header #nav .InBox &gt; div.gnb &gt; div.GnbNav &gt; div.nv &gt; div h3             {color:#fff;margin-bottom:15%;letter-spacing:1px;font-size:25px; font-weight:bold;}
 #header #nav .InBox &gt; div.gnb &gt; div.GnbNav &gt; div.nv &gt; div &gt; ul           {width:100%;}
 #header #nav .InBox &gt; div.gnb &gt; div.GnbNav &gt; div.nv &gt; div &gt; ul &gt; li      {line-height:2;padding:2.5px 0;margin-bottom:5px;}
 #header #nav .InBox &gt; div.gnb &gt; div.GnbNav &gt; div.nv &gt; div &gt; ul &gt; li a    {color:#fff;font-size:14px;}		

  #header .gnb &gt; div div.bg                                        {position:absolute;top:0;left:0;width:100%;height:100%;}
  #header .gnb &gt; div div.bg:before                                 {position:absolute;top:0;left:0;width:100%;height:100%;content:"";background:#111;opacity:0.5;display:block;}	
  #header .gnb &gt; .close                                            {position:absolute;top:3%;right:3%;z-index:10;}

 #header #nav div.event	                                                {width:100%;padding:50px 0;background:#20332f;}
 #header #nav div.event div h3                                            {text-align:center;margin-bottom:3%;}
 #header #nav div.event div h3 strong                                     {display:block;color:#9a825a;font-size:20px;}
 #header #nav div.event div h3 span                                       {display:block;color:#e8e8e8;font-size:15px;margin:5px 0 15px;}
 #header #nav div.event div ul                                            {width:95%;padding:0 15px;margin:0 auto;overflow:hidden;}
 #header #nav div.event div ul li 							            {width:48%;float:left;margin:0 1%;}

  .Swipers .InBox {height:60vh;}

  /* footer .ft_top {display:none;}
  footer .inner {padding:0;}
  footer .inner .ft_img {display:none;}
  footer .inner ul li span {font-size:14px; display:block; margin-top:15px;}
  footer .inner .ft_info1 {margin:40px 10px;}
  footer .inner .ft_info2 {margin:65px 10px 40px 10px;}
  footer .wrap {border-bottom:none;}
  footer .ft_bottom .icons {display:block;}
  footer .ft_bottom .icons span {display:block; flex:none; line-height:1.5;}
  footer .ft_bottom .icons a {float:left; margin:0 6px;}
  footer .ft_bottom .ft_resv {float:right; width:fit-content; padding:7px 10px;}
  footer .ft_bottom .ft_resv span {text-align:left; display:block;}
  footer .ft_bottom .ft_resv a {margin-top:10px;}
  footer .ft_bottom .copyright {clear:both;}
  footer .ft_bottom .icons a img {width:50px; height:50px;}
  footer .ft_bottom .copyright {height:80px; line-height:1.5;}
  footer .ft_bottom .copyright a {display:inline-block; margin-left:10px;} */

  /* new footer */
  .footer .footer_info .sns { float: none; margin-top: 0; margin-bottom: 30px; margin-right: 0; text-align: center; }
  .footer .footer_info .sns p img{width: 140px;}
  .footer .footer_info .sns li:first-of-type { margin-left: 0; }
  .footer .footer_menu ul li { margin-bottom: 10px; }
  .footer .footer_menu ul li:first-child{margin-left: 0;}
  #index .list ul li div strong {font-size:15px; margin:15px 0 7px;}
  #index .list ul li div span {font-size:12px; line-height:1.5;}
  #index .list ul {height:calc(100% - 80px);}
  #index .list ul li &gt; div {top:50%; left:5%; transform:translateX(5%); margin-top:-40px;}
  #index .list ul li div:hover strong {font-size:15px; margin:15px 0 7px;}
  #index .list ul li div span b {margin:10px 0 10px;}
  #index .room-preview .Swipers{width: 60%;}
  #index .room-preview .Swipers .InBox {height: 50vw;}
  #index .room-preview .swiper-arrow{width: 80%; bottom: -326px;}
  #index .room-preview .Swipers .swiper-pagination {bottom: -268px;}
  #index .room-preview .Swipers .swiper-pagination .swiper-pagination-bullet {width: 20px;}

  #media .section {padding-top:140px;}
  #media .offers &gt; ul li .txt strong {font-size:14px;}
  #media .offers &gt; ul li .txt span {font-size:12.5px;}
  #media .offers &gt; ul li .txt a {font-size:14px;}
  #media .offers h3 strong {font-size:20px;}
  #media .offers h3 span {font-size:15px;}

  .detail #banner {height:60vh;}
  .detail .section:first-child h2, 
  .special .section:first-child h2 {margin:0; transform:translate(-50%, -50%);}
  .detail .section:first-child h2 img, 
  .special .section:first-child h2 img {width:500px; height:auto; margin:0 auto;}
  .detail #contents &gt; .InnerBox .slides .info &gt; div { flex-direction: column; }
  .detail #contents &gt; .InnerBox .slides .info &gt; div b { margin-bottom: 10px; }
  .detail #contents &gt; .InnerBox .eq .img  {float:none; width:95%; margin-left: 5%;}
  .detail #contents &gt; .InnerBox .eq .txt {float:none; width:100%; margin-left:none;}
  .detail #contents &gt; .InnerBox .eq .txt &gt; div.t02 ul li {font-size:11.5px; width: 40%; }
  .detail #contents &gt; .InnerBox .eq .txt strong {font-size:20px; margin-top:3%;}
  .detail #contents &gt; .InnerBox .eq .txt &gt; div.t01 li {font-size:15px;}
  .detail #contents &gt; .InnerBox {width:100%; margin:0 auto;}
  .detail #contents &gt; .InnerBox .eq .txt &gt; div.t02 p{font-size: 21px; font-weight: bold; line-height: 33px;}
  .slide_02 {width: 95%;}
  .detail #contents &gt; .InnerBox .slides .info div ul li strong { width: 100%; height:fit-content;}
  .detail #contents &gt; .InnerBox .eq .txt &gt; div.t02 p{padding: 0 0 20%;}
  .detail #contents &gt; .InnerBox .eq .txt &gt; div.t02 span{right: 0; bottom: 5%;}
  .special #contents &gt; .txt p {font-size:13px;}
  .special #banner {height:60vh;}

  .sub #banner {height:60vh;}
  .sub .section:first-child h2 img {width:300px; height:auto;}
  .section .snb {width:300px;}

  #location #contents .intro-div{display: block;}
  #location #contents .intro-div p:nth-child(2){width: 90%; margin: 0 auto; height: 625px; }
}
@media (max-width:1023px){
	div.water_wrap{width:90%; padding:0; margin-bottom:1rem}
	div.water_wrap h2{font-size:13px; margin-bottom:0.3rem;}
	div.water_wrap p{font-size:13px; margin-top:0.5rem; margin-left:0rem;}
	.water_wrap table{font-size:13px;}
	/*
	.water_wrap table thead{display:none;}
	.water_wrap table tr{display:block; margin-bottom:0.5rem}
	.water_wrap table td{display:flex; padding:0; align-items:center; border-right:0; }
	.water_wrap table td:last-child{border-bottom:0}
	.water_wrap table td:before{display:block; width:30%; background-color:#353535; border-right:1px solid #b9b9b9; color:#fff; padding:1rem; margin-right:1rem}
	.water_wrap table td:nth-child(1):before{content:'객실';}
	.water_wrap table td:nth-child(2):before{content:'미온수(29~30℃)';}
	.water_wrap table td:nth-child(3):before{content:'온수(32~33℃)';}
	.water_wrap table td:nth-child(4):before{content:'제공시간';}
	*/
	.water_wrap table th,
	.water_wrap table td{width:25%; padding:12px 5px;}
}	
@media(max-width:768px) {
  .moving1 h2,.moving1 p{animation: txt-ani; animation-duration: .5s;animation-fill-mode: forwards; }
  .moving1 span{animation: txt-ani; animation-duration: .9s;animation-fill-mode: forwards;}


  .rooms_01 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/room/1/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .rooms_02 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/room/2/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .rooms_03 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/room/3/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .rooms_04 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/room/4/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .rooms_05 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/room/5/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .rooms_06 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/room/6/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .rooms_07 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/room/7/0.jpg) no-repeat 50% 50%;background-size:cover;}
  #fpv #banner 							{background:url(http://gonylab9.speedgabia.com/penta/m/facility/1/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .facil_01 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/facility/1/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .facil_02 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/facility/2/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .facil_03 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/facility/3/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .facil_04 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/facility/4/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .facil_05 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/facility/5/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .facil_06 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/facility/6/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .facil_07 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/facility/7/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .facil_08 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/facility/8/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .facil_09 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/facility/9/0.jpg) no-repeat 50% 50%;background-size:cover;}
  .facil_10 #banner 						{background:url(http://gonylab9.speedgabia.com/penta/m/facility/10/0.jpg) no-repeat 50% 50%;background-size:cover;}
  
  .m-call{display: block;}
  .footer .footer_info .company_info{float: none;}
  .footer .wrap &gt;ul{    display: flex;flex-wrap: wrap; justify-content: center;}
  .footer .footer_menu ul li{margin: 10px 0 10px 0; padding: 0 20px;}
  .footer .footer_info .company_info ul li{font-size: 12px; margin-right: 0; display: block; text-align: center;}
  .footer .createdBy{text-align: center; margin-top: 20px;}
  .section .snb li a {font-size: 13px;}

  /* 예약페이지 연동 검색바 */
  #reserveBar { height: 270px; width: 100%; bottom: -270px;}
  #reserveBar form .wrap { flex-wrap: wrap; }
  #reserveBar form .wrap .box { width: 50%; flex: auto; }
  #reserveBar form .wrap .box p { margin-top: 20px; margin-bottom: 10px; }
  #reserveBar form .wrap .box:not(:last-child) { padding: 0; }
  #reserveBar form .wrap .box-checkin { border-bottom: 1px solid #ddd; }
  #reserveBar form .wrap .box-checkout { border-bottom: 1px solid #ddd; }
  #reserveBar form .wrap .box-checkout::after { display: none; }
  #reserveBar form .wrap .box-type::after { display: none; }
  #reserveBar form .wrap .box-type { width: 100%; }
  #reserveBar form .wrap .box select { min-width: 180px; }
  /* popup */
  /* .popup1 { width: 300px !important; } */

  .slide #nav &gt; a {width:40px;height:auto;}
  .slide #nav &gt; a img { width: 40px !important; }

  #index .visual-video { height: 500px; overflow: visible;}
  #index .visual-video .MyFrame { height: 500px; }
  .section:first-child h2{font-size: 23px; letter-spacing: 14px;}
  #index .offers h3 { text-align: center; margin-top: 30px; }
  #index .offers h3 strong {display:inline-block; text-align: center; margin-left:10px;}
  #index .offers h3 span {display:inline-block; text-align: center; margin-top: 10px; }
  #index .offers ul li:last-child {display:none;}
  #index .offers ul li .txt strong {font-size:14px;}
  #index .offers ul li .txt span {font-size:12px;}
  #index .offers ul li .txt a {font-size:14px;}
  #index .offers h3 span {font-size:15px;}
  
  #index .restaurant h3 strong {font-size:28px;}
  #index .restaurant h3 span {font-size:15px;}
  #index .Swipers .swiper-button-prev,  #index .Swipers .swiper-button-next {width: 40px; height: 50px;}
  #index .swiper-arrow{height: 50px;}
  #index .restaurant .Swipers {width:100%; }
  #index .restaurant .swiper-view .InBox {height:95vw;}
  #index .restaurant .swiper-container .title {right:20px;}
  #index .restaurant .swiper-container .title span {font-size:14px;}
  #index .restaurant .swiper-container .title a {font-size:10.5px;}
  #index .restaurant .Swipers .swiper-views .swiper-slide:first-of-type div::before {content:""; position: absolute; width:100%; height:100%; top:0; left:0; background:#000; opacity:0.67;}

  #index .video .ttl h3 {font-size:27.5px;}
  #index .video .ttl h3 span {font-size:16px;}
  #index .video #iframe {width:90%; height:300px;}
  #index .main-txt2 h2{position: static; font-weight: bold; transform: translate(0); font-size: 21px;line-height: 33px;margin: 8% 0 0 5%;}
  #index .main-txt2 span {bottom: unset; top: 25%; right: 0; font-size: 10px; line-height: 17px;}

  #index .restaurant{display: flex; flex-wrap:wrap-reverse;}
  #index .restaurant .main-txt2 {height: 200px;  padding-left: 0;width: 100%;}
  #index .fa-direct .fa-pic{width: 90%; margin-right: 5%; height: 95vw;}
  #index .fa-direct{flex-wrap: wrap; margin-top: 75px; height: auto;}
  #index .fa-direct .fa-txt1{order: 3;    padding: 8% 14px 0 36%;     width: 90%;height: 95vw; box-sizing: content-box;}
  #index .fa-direct .fa-txt1 h2{    font-size: 14px; line-height: 28px;font-weight: bold;}
  #index .fa-direct .fa-txt1 p{font-size: 10px; line-height: 19px; margin-bottom: 47px;}
  #index .fa-direct .fa-txt1 a {    width: 58%;height: 45px;line-height: 45px;font-size: 11px; }
  #index .fa-direct .main-txt2{width: 30%; position: absolute; order: 2; left: -17px; bottom: 42%;}
  #index .fa-direct .main-txt2 span{bottom: unset; top: 0;}
  #index .list {height:700px;}
  #index .list .img {position:relative;width:100%;height:100%;}
  #index .list .img div {position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;opacity:0;}
  #index .list .img div:before {position:absolute;left:0;top:0;width:100%;height:100%;content:"";background:#000;opacity:0.3;}
  #index .list ul {position:absolute;width:100%;height:calc(100% - 75px);overflow:hidden;z-index:2;}
  #index .list ul li {position:relative;float:left;width:100%;height:25%;}
  #index .list ul li a {position:absolute;top:50%;left:0;width:100%;height:fit-content;margin-top:-120px;text-align:center;display:block;overflow:hidden;}
  #index .list ul li a strong {font-size:30px;font-family:linotype-didot;display:block;color:#fff;margin-top:105px;transition: 0.5s;}
  #index .list ul li a div {width:80px;height:1px;background:#e8e8e8;margin:25px auto;opacity:0;transition: 0.5s;}
  #index .list ul li a span {font-size:17px;line-height:1.8;display:block;color:#fff;opacity:0;transition: 0.5s;}
  #index .list ul li a b {font-size:15px;display:inline-block;color:#fff;margin-top:10px;padding:5px 10px;letter-spacing:1px;}
  #index .list ul li a.active strong {font-size:40px;margin:0;}
  #index .list ul li a.active div {opacity:1;}
  #index .list ul li a.active span {opacity:1;}
  #index .main-txt1{ padding: 47px 30px 75px 60px; width: 85%;}
  #index .main-txt1 h2{font-size: 26px; margin-bottom: 18px;}
  #index .main-txt1 p{font-size: 14px; margin-bottom: 31px;}
  #index .main-txt1 span{font-size: 10px; line-height: 17px; padding-right: 20px;}
  #index .main-txt1::before{width: 57%; height: 100%; left: -15%; top: 0%;}
  #index .list h3 {transform:unset; position: relative; font-size:25px; width:fit-content; height:fit-content; display:block; top:25px; left:30px; margin-bottom:20px;}
  #index .room-preview {height: 90vh;}

  #index .room-preview .Swipers {width: 80%;}
  #index .room-preview .Swipers .InBox{height: 59vw;}
  #index .room-preview .room-priv-txt div {margin: 33px auto 0px;}
  #index .room-preview .room-priv-txt a {font-size: 12px; }
  #index .room-preview .swiper-arrow {width: 500px;}

  #index .room-preview .room-priv-txt p:first-child {font-size: 18px; margin-bottom: 7px;}
  #index .room-preview .room-priv-txt p:nth-child(3) {font-size: 11px; line-height: 18px;}
.room-type{font-size: 10px ; margin-bottom: 17px; }

  #index .room-preview .room-priv-txt{bottom: -215px;}
  #index .room-preview .swiper-arrow {bottom: -260px;}
  #index .room-preview .Swipers .swiper-pagination{bottom: -238px;}

  #rooms .slide_02 {height: 64vw !important;}
  .detail #contents &gt; .InnerBox .slides .info &gt; div ul li {font-size:13px; display: block; margin-bottom: 5%;}
  .detail #contents &gt; .InnerBox .slides .info &gt; div ul{width: 90%;}
  .detail #contents &gt; .InnerBox .slides .info &gt; div ul li span{font-size: 10px; line-height: 19px;}
  .detail #contents &gt; .InnerBox .slides .info div ul li strong{margin-bottom: 5px;}
  .reserve-btn a {width: 38%;     margin: 50px 10px; font-size: 12px; height: 50px; line-height: 50px;}
  .detail .section:first-child h2 {font-size:30px; width: 100%; text-align: center; left: 0; transform: translateX(0);}
  .detail #contents &gt; .txt p {font-size:12.5px;}
  .detail #contents &gt; .txt span {font-size:25px;}
  .detail #contents &gt; .InnerBox .eq { padding: 5% 0; }
  .detail .section:first-child h2, .special .section:first-child h2{font-size: 30px;}
  .detail #contents &gt; .InnerBox .eq .txt &gt; div.t02 span{font-size: 10px; line-height: 17px; bottom: 4%;}
  .blueprint {    width: 92%; height: 54vh;}
  .blueprint i{font-size: 15px; }

   #facility .slides .img .txt h4{width: 100%;}
   #facility .slides .img .txt img{width: 100%;}
.sub .section:first-child h2{   font-size: 30px;}
.table .section:first-child h2{  font-size: 30px;}

.root_daum_roughmap{width: 100% !important;}
.m-call{background: url(../images/phone.png) 50% 50% no-repeat; background-size: cover; top: 2%; left: 4%; font-size: 0px; width: 40px; height: 40px;  line-height: 40px; }
.m-call a{display: block; width: 100%; height: 100%;}
#location #contents h2{font-size: 22px;  margin-bottom: 100px;}
#location #contents .intro-div p {line-height: 21px;font-size: 11px; margin: 50px 30px 0 30px;}
#location #contents .intro-div {margin-bottom: 35px;}
#location .location h3 {margin-top: 70px;}
#location #contents .intro-div p:first-child{height: 304px !important;}
#location #contents .intro-div .loca-mb{display: block;    width: 100%;margin: 0 auto;    height: 350px;background: url(../images/intro3.png) 50% 50% no-repeat; margin-bottom: 50px; background-size: 100% 100%;}
#location #contents .intro-div p:nth-child(2){height: 400px; background-image: url(../images/intro2.jpg); background-size: 100% 100%;}
#location .location .txt p em {width: 90px;}
#location .location .txt{padding:40px 0;}
#location .location .txt p span{font-size: 13px;}
#location #contents .intro-div p:nth-child(2){display: none; height: 626px !important;}
#location #contents .room-map h2{font-size: 35px; margin-bottom: 65px;}
.room-map::after{background-image: url(/images/room-map-m.jpg); width: 96%; height: 58vw;}
#travel .contents .frame ul li {width:48%;}
#travel .contents .frame ul li span{font-size: 10px; }
#travel .contents .frame ul li strong{font-size: 16px;}
#travel .contents .frame ul li em{font-size: 12px;}
#travel .contents h3 span{font-size: 12px;}
#travel .contents h3 strong{font-size: 30px;}

.special #contents &gt; .txt span{font-size: 18px;}
.special #contents &gt; .txt p{font-size: 10px;}

#reserve .tab_02 .r_info_01{overflow-x: scroll;}
#reserve .tab_02 table{width: 650px;}
#reserve .tab_02 table tr th, #reserve .tab_02 table tr td{font-size: 10px;}

#reserve .tab_02 .r_info_03{ overflow-x: scroll;}
}

@media (max-width:767px){
	.water_wrap table th,
	.water_wrap table td{font-size:10px}
	div.water_wrap p{font-size:10px}
}
@media(max-width:680px) { 

}

@media(max-width:360px) {

}</pre></body></html>