@charset "utf-8";

.main {position:relative}
.main .main_box {width:100%; text-align:center; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); padding:0 20px;}
.main h2 {
    font-size: 50px;
    color: #fff;
    font-weight: 200;
    margin: 15px 0px 26px;
    line-height: 1.3;
    word-break: keep-all;
    letter-spacing: -4px;
}
.main h2 span {font-weight:500;}
.bn_po_txt{
	font-size: 67px;
    line-height: 0.8;	
}
.main p.reserv {
    font-size: 21px;
    color: #fff;
    word-break: keep-all;
    font-weight: 100;
    margin-top: 10px;
    padding: 5px 10px;
    display: inline-block;
	letter-spacing: -0.5px;
}
.main p.reserv span {
    padding: 0 10px;
    color: #c8c8c8;
}
.main_bnBtm{text-align:center;}
.main_bnBtm a {
    display: inline-block;
    color: #f8b62c;
    font-size: 22px;
    border: 3px solid #f8b62c;
    margin-top: 25px;
    padding: 9px 25px 8px;
    border-radius: 100px;
}
.main_bnBtm a:hover{color: #f8b62c;} 

.main_slide .slick-slide{height: 700px; }
.main_slide .img01 { background-image:url(../img/main_banner1.jpg); background-size: cover; background-position: center;}
.main_slide .img02 { background-image:url(../img/main_banner2.jpg); background-size: cover; background-position: center;}
.main_slide .img03 { background-image:url(../img/main_banner3.jpg); background-size: cover; background-position: center;}
.main_slide .img04 { background-image:url(../img/main_banner4.jpg); background-size: cover; background-position: center;}

.bn_br_mo{display:none}

@media (max-width:969px) {
  .main {}
  .main h2 {font-size:43px;}
  .main h3 {font-size:25px;}
  .main p.reserv {font-size:18px;}	
  .main_bnBtm a {font-size:18px;}	
  .main_slide .slick-slide {height: 600px;}    
}

@media (max-width:767px) {
  .main {}
  .main h2 {font-size:42px; margin: 15px 0px 15px;}
  .bn_po_txt {font-size: 50px;}
  .main h3 {font-size:18px; line-height:1.4;}
  .main p.reserv {font-size:16px; margin-top:10px;}	
  .main_bnBtm a {font-size:16px; margin-top: 30px;}	
  
   .main_slide .slick-slide {height: 480px;}    
}
@media (max-width:668px) {
  .main h2 {font-size:32px;}	
}
@media (max-width:575px) {
  .main {}
  .main h2 {font-size:34px; margin:16px 0 20px;    line-height: 1.2;}	
  .main h2 br{display:none}
  .bn_po_txt {font-size: 42px;}
  .main p.reserv{
        margin-top: 0px;
        padding: 5px 4px;
        max-width: 295px;	  
		font-size: 14px;
  }
  .main p.reserv span {}
  .main_bnBtm a {font-size: 15px; margin-top: 20px;}
  
   .main_slide .slick-slide {height: 460px;}    
   .bn_br{display:none}
   .bn_br_mo{display:block}
}