/*공통*/
@media screen and (max-width:1300px){ 
    .inner1,
	.inner2{width:97%;}
}
@media screen and (max-width:1024px){ 
    .reservation_m{display:block; position:absolute; right:20px; top:25px; z-index:9;}
	.reservation_m h2{text-align:center; font-size:15px; font-weight:normal;}
	.reservation_m h2 a{display:block; color:#454545;}

    #mobile_menu h1{text-align:center;}
    #mobile_menu h1 a{display:inline-block}
	#mobile_menu {position:relative; background:#fff; border-bottom:1px solid #ededed;}

	footer p img{width:170px;}
}
@media screen and (max-width:1300px){ 
    .title{ font-size:41px;}
}
@media screen and (max-width:420px){  
    #mobile_menu h1{position:relative; top:7px;}
    .reservation_m{right:10px;}
	.reservation_m h2{font-size:14px;}

	.title{ font-size:37px;}
}
@media screen and (max-width:385px){ 
    #mobile_menu h1 img{width:98px;}
	.reservation_m{top:25px;}
	.title{ font-size:33px;}
}

/*visual*/
@media screen and (max-width:1024px){ 
    .visual{margin-top:70px;}

	.vis_box li{
	   min-height: calc(100vh - 50px); 
       height:  calc(var(--vh, 1vh) * 100 - 50px);
	}
	.vis_box li div{ padding-top:0px;}
	.vis_box li div p b{font-size:50px;}
}
@media screen and (max-width:800px){ 
    .vis_box li{
	   min-height: calc(100vh - 80px); 
       height:  calc(var(--vh, 1vh) * 100 - 80px);
	}
	.vis_box li div p b{font-size:50px;}
	.vis_box li div p {padding:0 10px;}
}
@media screen and (max-width:680px){ 
	.vis_box li div p b{font-size:41px;}

    #mobile_menu h1 img, 	footer p img{width:130px;}
}
@media screen and (max-width:580px){ 
    .visual > span.btn_prev,
	.visual > span.btn_next{width:30px; height:30px; background-size:30px;}
    .vis_box li{
	   min-height: calc(100vh - 120px); 
       height:  calc(var(--vh, 1vh) * 100 - 120px);
	}

    .vis_box li div{padding-top:0px; padding-bottom:150px;}
	.vis_box li div p b{font-size:41px;  margin-bottom:80px;}
	.vis_box li div p b:after{height:35px; bottom:-50px;}
	.vis_box li div p b br{display:block;}
}
@media screen and (max-width:420px){ 
    .vis_box li{
	   min-height: calc(100vh - 160px); 
       height:  calc(var(--vh, 1vh) * 100 - 160px);
	}

	.vis_box li div p b{font-size:37px;}
	.vis_box li div p{font-size:17px;}

    #mobile_menu h1 img, 	footer p img{width:110px;}
}
@media screen and (max-width:385px){ 
    .vis_box li{
	   min-height: calc(100vh - 210px); 
       height:  calc(var(--vh, 1vh) * 100 - 210px);
	}
	.vis_box li div p b{font-size:31px;}
	.vis_box li div p{font-size:16px;}
}
@media screen and (max-width:320px){ 
    .vis_box li{
	   min-height: calc(100vh - 320px); 
       height:  calc(var(--vh, 1vh) * 100 - 320px);
	}
	.vis_box li div p b{font-size:27px;}
	.vis_box li div p{font-size:14px;}
}

/*mov*/
@media screen and (max-width:975px){ 
   .mov_wrap{height:600px;}
   .mov {width:90%;}
}
@media screen and (max-width:520px){ 
   .mov_wrap{height:550px;}
   .mov {width:94%;}
}
@media screen and (max-width:420px){ 
   .mov_wrap{height:500px;}
}
@media screen and (max-width:360px){ 
   .mov_wrap{height:450px;}
}

/*etc*/
@media screen and (max-width:680px){ 
   .etc{height:300px;}
   .etc > div{font-size:15px;}
   .etc > div h2{font-size:16px;}
}

/*section1*/
@media screen and (max-width:1024px){ 
   .section1 .inner1 > h2{width:30%;}
   .section1 .inner1 > div{width:70%;}
}
@media screen and (max-width:810px){ 
   .section1 .inner1 > h2{font-size:27px;}
   .section1 .inner1 > h2 span{font-size:35px;}

   .section1 .inner1 > div{padding-left:30px; padding-top:50px}
   .section1 .inner1 > div p b{font-size:27px;}
}
@media screen and (max-width:667px){ 
  .section1 .inner1 > h2{padding:30px 20px 200px 20px;}
}
@media screen and (max-width:580px){ 
  .section1 .inner1{display:block; text-align:center;}
  .section1 .inner1 > h2{width:100%; padding:30px 20px;}
  .section1 .inner1 > div{width:100%; padding:0 20px !important;}
}
@media screen and (max-width:420px){ 
  .section1 .inner1 > div p b{font-size:31px;}
}

/*section2*/
@media screen and (max-width:975px){ 
    .section2 .inner_ > div h3{font-size:27px;}
	.section2 .inner_ > div p{font-size:16px;}
	.section2 .inner_ > div p b{font-size:21px; margin-bottom:15px;}

	.section2 .inner_ > div p a{font-size:15px; padding:10px 30px; margin-top:20px;}

	.section2 .slick-prev,
	.section2 .slick-prev:hover,
	.section2 .slick-prev:focus{left:5px}
	.section2 .slick-next,
	.section2 .slick-next:hover,
	.section2 .slick-next:focus{right:5px}
}
@media screen and (max-width:680px){ 
    .section2 .inner1 > p{margin-bottom:50px;}
    .section2 .inner_{display:block;}
    .section2 .inner_ > div{width:100%; padding:30px !important; text-align:center;}
    .section2 .inner_ > p{width:100%; padding:0 30px !important;}
	.section2 .slick-dots{bottom:-30px;}

	.section2 .slick-prev,
	.section2 .slick-prev:hover,
	.section2 .slick-prev:focus{left:0px}
	.section2 .slick-next,
	.section2 .slick-next:hover,
	.section2 .slick-next:focus{right:0px}
}
@media screen and (max-width:480px){ 
    .section2 .inner_ > div{padding:20px !important;}
    .section2 .inner_ > p{padding:0 20px !important;}

	.section2 .slick-prev,
    .section2 .slick-next{width:32px; height:32px; top:30%}

    .section2 .slick-prev,
	.section2 .slick-prev:hover,
	.section2 .slick-prev:focus,
	.section2 .slick-next,
    .section2 .slick-next:hover,
    .section2 .slick-next:focus{background-size:32px;}
	.section2 .slick-prev,
	.section2 .slick-prev:hover,
	.section2 .slick-prev:focus{left:15px}
	.section2 .slick-next,
	.section2 .slick-next:hover,
	.section2 .slick-next:focus{right:15px}
}
@media screen and (max-width:420px){ 
    .section2 .inner_ > div{padding:20px !important; text-align:left;}
    .section2 .inner_ > p{padding:0 !important;}
	.section2 .slick-dots{bottom:-20px;}
    .section2 .inner_ > div p a{display:block; text-align:center; padding:10px 0}
	.section2 .slick-slide{margin:0 10px;}

	.section2 .slick-prev,
    .section2 .slick-next{top:27%}
	.section2 .slick-prev,
	.section2 .slick-prev:hover,
	.section2 .slick-prev:focus{left:25px}
	.section2 .slick-next,
	.section2 .slick-next:hover,
	.section2 .slick-next:focus{right:25px}
}

/*section3*/
@media screen and (max-width:1400px){ 
    .section3 .inner > div{width:60%; bottom:20px; right:20px;}
    .section3 .slick-slide{margin:0 10px;}
}
@media screen and (max-width:1025px){ 
    .section3 .inner > div{width:50%;right:-30px;}
    .section3 .slick-slide{margin:0 30px;}
}
@media screen and (max-width:975px){ 
    .section3 .slick-slide{margin:0 30px;}
	.section3 .inner > div{padding:20px}
	.section3 .inner > div h3{font-size:21px;}
	.section3 .inner > div p{font-size:15px}
}

@media screen and (max-width:680px){ 
    .section3 > p{margin-bottom:50px;}
	.section3 .slick-slide{margin:0 25px;}
	.section3 .inner > div{padding:20px; width:60%}
	.section3 .slick-initialized .slick-slide img{width:85%;}
}
@media screen and (max-width:580px){ 
    .section3 .slick-slider .slick-track{padding-bottom:20px;}
    .section3 .slick-slide{margin:0 25px; border:1px solid #ededed;}
	.section3 .slick-slide.slick-center{box-shadow:15px 15px 10px -5px rgba(0,0,0,0.2);}
	.section3 .inner > div{position:relative; bottom:0; right:0; width:100%; box-shadow:0 0 0 0 rgba(0,0,0,0.2);}
	.section3 .slick-initialized .slick-slide img{width:100%;}
	.section3 .slick-dots{bottom:-40px;}
}
@media screen and (max-width:421px){ 
    .section3 .slick-slide{margin:0 10px;}
}

/*instart_box*/
@media screen and (max-width:480px){ 
   .instart_txt{align-items:flex-start;} 
   .instart_box ul li{width:calc(100% / 3 - 4px); margin:2px}
}

/*quick*/
@media screen and (max-width:1024px){ 
   .quick{height:300px}
   .quick ul{width:97%;} 
}
@media screen and (max-width:580px){ 
   .quick ul li{width:calc(100% / 2 - 20px); margin:0 10px;}
}
@media screen and (max-width:480px){ 
   .quick ul{width:90%;} 
   .quick ul li{width:calc(100% / 1 - 20px); margin:10px 10px;}
   .quick ul li a{padding:20px 0px;}
}

/*footer*/
@media screen and (max-width:1024px){ 
   footer .inner1{display:block; text-align:center;} 
   footer .inner1 > p{margin-bottom:15px}
}