	
	#mobile {
		display: block;
		padding-top: 10.5%;
	}
	#mobile_visual {
		position: relative;
	}
	#mobile_visual div.intro {
		position: absolute;
		top: 51%;
		left: 27%;
		z-index: 100;
		width: 55%;
	}
	#mobile_visual div.intro .image img {
		max-width: 100%;
	}
	#mobile_visual div.intro .text {
		color: #fff;
		font-weight: 100;
		margin-top: 3%;
		font-size: 1.15vw;
	}
	#mobile_visual .main_paging1,
	#mobile_visual .main_paging2,
	#mobile_visual .about_paging1,
	#mobile_visual .about_paging2 {
		position: absolute;
		bottom: 6%;
		left: 82%;
		z-index: 10;
		width: 5%;
	}
	#mobile_visual .main_paging2,
	#mobile_visual .about_paging2 {
		left: 87.2%;
	}
	#mobile_visual .main_paging1 img,
	#mobile_visual .main_paging2 img,
	#mobile_visual .about_paging1 img,
	#mobile_visual .about_paging2 img {
		max-width: 100%;
	}





@media (max-width: 1600px) {
	.row {
		padding: 0 15px;
	}
	.container{
		width: 100%;
	}
	header:after {
		background: #072025;
		height: 90px;
		display: none;
	}
	header:before {
		display: none;
	}
	header h1 {
		width: 100%;
		height: 90px;
		background-color: #072025;
	}
	header .headerWrap nav {
		float: none;
	}
	header .headerWrap nav > ul {
		padding: 0;
		background-color: #fff;
		width: 100%;
		display: none;
		border-bottom: 1px solid #eee;
	}
	header .headerWrap nav > ul > li {
		text-align: center;
		width: 12.5%;
		height: 70px;
		line-height: 70px;
	}
	header .headerWrap nav > ul > li > a {
		color: #000;
		width: 100%;
		height: 100%;
		margin-bottom: 0;
		padding: 0;
		line-height: 347%;
	}
	header .headerWrap nav ul.sub_menu {
		display: none;
	}
	header .headerWrap .logoWrap img {
		padding: 12px 20px 18px 5px;
	}
	header .headerWrap button {
		float: left;
		margin-left: 0;
		position: absolute;
		top: 0;
		right: 0;
		padding: 0;
		width: 120px;
		height: 90px;
		background-color: #1F7CE5;
	}
	header .headerWrap button img.ico1 {
		display: none;
	}
	header .headerWrap button img.ico2 {
		display: block;
		margin: 0 auto;
		max-width: 100%;
	}
	header .headerWrap button .menu_ico {
		width: 27%;
		display: inline-block;
	}
	header .headerWrap button.reservation_button {
		right: 120px;
	}
	header .headerWrap button.menu_open,
	header .headerWrap button.menu_close {
		display: block;
		background-color: #57A5FE;
	}
	header .headerWrap button.menu_close {
		display: none;
	}
	header .headerWrap button span {
		display: block;
		margin-top: 4px;
	}
	.sub_preview_res {
		display: none;
	}
	#main_visual {
		padding-top: 5%;
	}

	
}
@media (max-width: 1280px) {
	.infoContent  {
		display: none;
	}
	.sectionTitle {
		display: none;
	}
	.M_sectionTitle {
		display: block;
		text-align: center;
		color: #333;
		font-size: 18px;
		margin-bottom: 2%;
	}
	.M_sectionTitle2 {
		margin-top: 6%;
	}
	
	header .headerWrap nav > ul > li {
		width: 16.66%;
	}
	header .headerWrap button span {
		font-size: 12px;
	}
	section.subVisual {
		display: none;
	}
	section.subNav {
		padding-top: 90px;
		border-bottom: none;
	}
	section.subNav ul {
		background-color: #F2F2F2;
	}
	section.subNav ul li {
		width: calc(14.295% - 1px);
		text-align: center;
		border-right: 1px solid #cecece;
		border-bottom: 1px solid #cecece;
	}
	section.subNav ul li:nth-child(7) {
		border-right: 0;
	}
	section.subNav ul li a {
		font-size: 14px;
		width: 100%;
		height: 70px;
		line-height: 70px;
		padding: 0;
	}
	section.subNav ul li:hover,
	section.subNav ul li.on {
		border-color: #cecece;
	}
	section.subNav ul li:hover a, 
	section.subNav ul li.on a {
		background-color: #616161;
	}




	section.roomsViewWrap .roomContent1 .roomContent1ImgWrap {
		display: none;
	}
	section.roomsViewWrap .roomContent1 .roomContent1TextWrap {
		float: none;
		width: 100%;
	}
	section.roomsViewWrap .roomContent1 .roomContent1TextWrap button {
		margin-top: 6.5%;
	}
	section.roomsViewWrap .roomContent1 .roomContent1TextWrap .content,
	section.serviceViewWrap .content p,
	section.travelViewWrap .travelImgWrap p,
	section.trafficWrap .trafficContent .content,
	section.reservationWrap .text,
	section.facilitiesViewWrap .facilitieuSubInfo{
		line-height: 18px;
	}
	
	


	
	section.travelListWrap .title,
	section.travelListWrap .subTitle {
		display: none;
	}
	section.travelListWrap .travelListContent {
		padding-top: 10%;
	}
	section.travelListWrap .travelListContent .travelList:nth-of-type(3n+2) {
		margin-right: 3.55%;
		margin-left: 3.55%;
	}
	section.travelListWrap,
	section.serviceViewWrap,
	section.trafficWrap,
	section.serviceListWrap {
		margin-top: 0;
	}


	
	
	section.trafficWrap .pageTitle {
		display: none;
	}
	section.trafficWrap .trafficContent .title_first {
		padding-top: 10%;
	}


	section.serviceViewWrap .serviceName {
		padding-top: 10%;
	}
	section.serviceListWrap .title,
	section.serviceListWrap .subTitle{
		display: none;
	}
	section.serviceListWrap .container {
		background: none;
		min-height: 0;
	}
	section.serviceListWrap .serviceListContent {
		padding-top: 9%;
		text-align: left;
	}
	section.serviceListWrap .serviceListContent .serviceList {
		background-color: #F5F5F5;
		width: 32.4%;
	}
	section.serviceListWrap .serviceListContent .serviceList:nth-child(1) {
		margin-left: 0;
	}
	section.serviceListWrap .serviceListContent .serviceList:nth-child(3n) {
		margin-right: 0;
	}

}
@media (max-width: 900px) {
	header .headerWrap nav > ul > li {
		width: 25%;
	}
	#main_visual {
		padding-top: 8%;
	}
	#main_visual .down {
		display: none;
	}
	section.cardListContent .cardListWrap .card {
		width: 49.5%;
	}
	section.cardListContent .cardListWrap .card:nth-child(3n+2) {
		margin: 0 0 2.2%;
	}
	section.cardListContent .cardListWrap .card:nth-child(odd) {
		margin-right: 0.75%;
	}
	section.imgListContent .imgListContentWrap .imgContent {
		width: 50%;
	}
	section.imgListContent .imgListContentWrap .imgContent:nth-of-type(n+3) {
		
	}


	section.subNav ul li {
		width: calc(20% - 1px);
	}
	section.subNav ul li:nth-child(5) {
		border-right: 0;
	}
	section.subNav ul li:nth-child(7) {
		border-right: 1px solid #cecece;
	}


	section.travelListWrap .travelListContent .travelList {
		width: 48.1%;
	}
	section.travelListWrap .travelListContent .travelList:nth-of-type(3n+2){
		margin-right: 0;
		margin-left: 0;
	}
	section.travelListWrap .travelListContent .travelList:nth-of-type(2n+1){
		margin-right: 3.6%;
	}
	

	footer {
		padding: 0;
		padding-top: 10px;
	}
	footer .companyInfoWrap,
	footer .contactInfoWrap,
	footer .mapInfo {
		width: 100%; 
	}
	footer .contactInfoWrap {
		border-top: 1px solid #fff;
		border-bottom: 1px solid #fff;
	}
	footer .companyInfoWrap p {
		margin: 8px 0;
	}
	footer .companyInfoWrap p.mb-40 {
		margin-bottom: 15px;
	}
	footer .companyInfoWrap .companyInfo,
	footer .contactInfoWrap .contactInfo {
		text-align: center;
	}
	footer .contactInfoWrap .contactInfo {
		padding-top: 10px;
	}
	footer .contactInfoWrap .contactInfo .number.mb {
		margin-bottom: 10px;
	}
	footer .contactInfoWrap .contactInfo .number {
		margin-top: 3px;
	}
	footer .companyInfoWrap, 
	footer .contactInfoWrap, 
	footer .mapInfo {
		padding-top: 10px;
		padding-bottom: 20px;
	}
	footer .mapInfo .gotoTopWrap {
		padding-left: 1.5%;
	}


	section.travelListWrap .travelListContent {
		padding-top: 13%;
	}
	footer .gotoTopWrap {
		display: block;
		padding: 4% 0;
		margin: 0 auto;
	}
	


}
@media (max-width: 768px) {
	
	header h1 {
		height: 70px;
	}
	header .headerWrap .logoWrap img {
		width: 160px;
		padding: 19px 20px 14px 2px;
	}
	header .headerWrap button {
		height: 70px;
		width: 80px;
	}
	header .headerWrap button.reservation_button {
		right: 80px;
	}


	section.subNav {
		padding-top: 70px;
	}
	section.subNav ul li {
		width: calc(25.03% - 1px);
	}
	section.subNav ul li:nth-child(4n) {
		border-right: 0;
	}
	section.subNav ul li:nth-child(5) {
		border-right: 1px solid #cecece;
	}

	
	
	section.travelListWrap .travelListContent {
		padding-top: 15%;
	}
	section.trafficWrap .trafficContent .title_first {
		padding-top: 15%;
	}
	


	section.serviceViewWrap .serviceName {
		padding-top: 15%;
	}
	section.serviceListWrap .serviceListContent {
		padding-top: 17%;
	}
	section.serviceListWrap .serviceListContent .serviceList {
		width: 49.2%;
		margin-bottom: 5%;
	}
	section.serviceListWrap .serviceListContent .serviceList:nth-child(2n+1) {
		margin-left: 0;
	}
	section.serviceListWrap .serviceListContent .serviceList:nth-child(2n) {
		margin-right: 0;
	}
	section.serviceListWrap .serviceListContent .serviceList:nth-child(3n) {
		margin-right: 0.7%;
	}
	section.serviceListWrap .serviceListContent .serviceList .serviceName {
		margin-bottom: 0;
	}
	section.serviceListWrap .serviceListContent .serviceList .serviceInfo {
		line-height: 18px;
	}
}
@media (max-width: 479px) {
	header .headerWrap .logoWrap img {
		width: 120px;
	}
	header h1 {
		height: 61px;
	}
	header .headerWrap button {
		height: 61px;
	}
	header .headerWrap .logoWrap {
		width: 26%;
	}
	header .headerWrap nav > ul > li {
		width: 33.33%;
		height: 55px;
		line-height: 55px;
	}
	#main_visual {
		padding-top: 13%;
	}


	section.subNav {
		padding-top: 60px;
	}
	section.subNav ul li {
		width: calc(33.4% - 1px);
	}
	section.subNav ul li:nth-child(4n) {
		border-right: 1px solid #cecece;
	}
	section.subNav ul li:nth-child(3n) {
		border-right: 0;
	}
	section.subNav ul li a {
		height: 40px;
		line-height: 40px;
	}



	section.cardListContent .cardListWrap .card {
		width: 100%;
	}
	section.cardListContent .cardListWrap .card:nth-child(odd) {
		margin-right: 0;
	}
	section.cardListContent .cardListWrap .card .textContent .content {
		font-size: 12px;
		line-height: 18px;
	}
	section.cardListContent .cardListWrap .card .textContent .title {
		margin-bottom: 1.5%;
	}


	section.crossListContent .crossListWrap .crossListRow .crossListText {
		display: none;
	}
	section.crossListContent .crossListWrap .crossListRow > div {
		width: 100%;
	}
	section.crossListContent .crossListWrap .crossListRow .crossListImg {
		margin-bottom: 5px;
		position: relative;
	}
	section.crossListContent .crossListWrap .crossListRow .mobile_text {
		display: block;
		position: absolute;
		bottom: 1.5%;
		right: 0;
		width: 47%;
		height: 40px;
		background-color: #1F7CE5;
		color: #fff;
		padding-top: 10px;
		padding-left: 15px;
		font-size: 12px;
	}
	section.crossListContent .crossListWrap .crossListRow .mobile_text span {
		display: block;
		margin-top: 3px;
	}
	

	section.cardListContent .cardListWrap .card .textContent .title,
	section.cardListContent .cardListWrap .card:hover .imgWrap .hoverContent p,
	section.imgListContent .imgListContentWrap .imgContent .hoverContent .title,
	section.roomsViewWrap .roomName,
	section.facilitiesViewWrap .facilitieName,
	section.serviceViewWrap .serviceName,
	section.travelListWrap .travelListContent .travelList p,
	.pageTitle,
	section.trafficWrap .trafficContent .title,
	section.travelViewWrap .travelName,
	section.serviceListWrap .serviceListContent .serviceList .serviceName{
		font-size: 14px;
	}
	
	
	section.cardListContent .cardListWrap .card:hover .imgWrap .hoverContent button,
	header .headerWrap button span,
	section.imgListContent .sectionSubTitle,
	section.roomsViewWrap .roomContent1 .roomContent1TextWrap .title,
	section.roomsViewWrap .roomContent1 .roomContent1TextWrap .content,
	section.roomsViewWrap .roomContent1 .roomContent1TextWrap button,
	section.roomsViewWrap .roomName small,
	section.subNav ul li a,
	section.facilitiesViewWrap .facilitieuSubInfo,
	section.facilitiesViewWrap .facilitieName small,
	section.serviceViewWrap .content p,
	section.serviceViewWrap .serviceName small,
	section.serviceViewWrap .content button,
	section.travelListWrap .travelListContent .travelList button,
	.pageTitle small,
	section.trafficWrap .trafficContent .content,
	section.travelViewWrap .travelImgWrap p,
	section.travelViewWrap .travelName small,
	section.reservationWrap .text,
	#table_box .td_top,
	#table_box .td_cell,
	section.serviceListWrap .serviceListContent .serviceList .serviceInfo,
	section.serviceListWrap .serviceListContent .serviceList button,
	section.travelListWrap .travelListContent .travelList p small,
	section.reservationWrap .strong {
		font-size: 12px;
	}

	section.facilitiesViewWrap .facilitieuSubInfo {
		line-height: 18px;
	}
	section.roomsViewWrap .roomName small,
	section.facilitiesViewWrap .facilitieName small,
	section.travelViewWrap .travelName small{
		margin-left: 3px;
	}
	
	
	
	section.travelListWrap .travelListContent {
		padding-top: 26%;
	}
	section.travelListWrap .travelListContent .travelList {
		width: 100%;
	}
	section.travelListWrap .travelListContent .travelList p {
		margin-top: 1%;
		margin-bottom: 0;
	}



	section.serviceListWrap .serviceListContent {
		padding-top: 21%;
	}
	section.serviceViewWrap .content button {
		position: static;
		width: 31%;
		padding: 13px 0;
		margin: 5px 0 13px 0;
	}
	section.serviceViewWrap .content p {
		margin-bottom: 6px;
	}
	section.serviceViewWrap .serviceName {
		padding-top: 23%;
	}
	section.trafficWrap .trafficContent .title_first {
		padding-top: 22%;
	}


	footer .companyInfoWrap p {
		font-size: 12px;
	}
	
	

}
@media (max-width: 400px) {
	header .headerWrap .logoWrap {
		width: 29%;
		height: 56px;
	}
}