@charset "utf-8";

@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css);

body{
font-size:14px;
font-family: 'Sawarabi Mincho', sans-serif;
    -webkit-text-size-adjust: 100%;
}


#PAGE{
position:relative;
padding:0;
margin:0;
color:#000;
}

#CONTENT{
width: 100%;
background-image: url(../img/common/bg01.jpg);
background-size: cover;
background-position: center center;
color: #fff;
margin:0 auto;
padding:0;
}

section{
max-width: 900px;
width: 95%;
margin: 0 auto;
padding: 100px 0;
}

#POP_CONTENT{
width:100%;
margin:0 auto;
border-top:5px solid #61c1be;
padding:0;
}
#POP_INNER{
max-width:710px;
width: 95%;
margin:0 auto;
padding:30px 0;
}

a{ color:#d00012;
text-decoration:underline;}

a:hover{ color:#d00012;
text-decoration:none;}


/* 基本リンクスタイル */
a {text-decoration: none;
}
* a:hover{
opacity:0.5;
filter: alpha(opacity=50);        /* ie lt 8 */
-ms-filter: "alpha(opacity=50)";  /* ie 8 */
-moz-opacity:0.5;                 /* FF lt 1.5, Netscape */
-khtml-opacity: 0.5;              /* Safari 1.x */
}


.br::before {
content: "\A" ;
white-space: pre ;
}
.br_sp::before {
	content: "" ;
	white-space:normal;
}
.br_sp480::before {
	content: "" ;
	white-space:normal;
}

.txt{
text-align: center;
line-height: 2.0em;
}

.pc{display: block;}
.sp{display: none;}
@media only screen and (max-width: 600px) {

.br::before {
	content: "" ;
	white-space:normal;
}

.txt{
text-align: left;
}

.br_sp::before {
content: "\A" ;
white-space: pre ;
}
}

@media screen and (max-width: 480px){
.br_sp480::before {
content: "\A" ;
white-space: pre ;
}

.pc{display: none;}
.sp{display: block;}
}

/*----------------------------------------------------
   ヘッダー
----------------------------------------------------*/
header{
background-color:#61c1be;
}


#HEADER{
max-width:900px;
width: 95%;
height:95px;
margin:0 auto;
padding:0;
position: relative;
}
#POP_HEADER{
width:95%;
height:95px;
margin:0 auto;
padding:0;
position: relative;
}


.logo{
position:absolute;
top:0;
left:0;
}

h1{
color: #231815;
}

.header_txt{
position:absolute;
top:5px;
right:0;
font-size:12px;
text-align:right;
}

.header_btn{
position:absolute;
top:30px;
right:0;
text-align:left;
}

.header_txt ul,
.header_btn ul{
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-pack:end;
-moz-box-pack:end;
-webkit-flex-pack:end;
-moz-flex-pack:end;
-ms-flex-pack:end;
-webkit-justify-content:flex-end;
-moz-justify-content:flex-end;
justify-content:flex-end;
}
.header_txt ul li,
.header_btn ul li{
margin:0 0 0 15px;
}

.header_txt ul li a{
color:#e60012;
}

.header_btn ul li{
        display:-webkit-box;
        display:-moz-box;
        display:-ms-flexbox;
        display:-webkit-flex;
        display:-moz-flex;
        display:flex;
        -webkit-box-align:center;
        -moz-box-align:center;
        -ms-flex-align:center;
        -webkit-align-items:center;
        -moz-align-items:center;
        align-items:center;
        }

.header_btn ul li.btn_res,
.header_btn ul li.btn_req {
width: 150px;
}

.header_btn ul li.btn_out,
.header_btn ul li.btn_map{
width: 50px;
}

.header_btn ul li.btn_out{
margin-right: 10px;
}

.header_btn ul li.btn_req a,
.header_btn ul li.btn_res a{
    width: 100%;
    display: block;
    padding: 30px 0;
    background: #000;
    color:#fff;
    position: relative;
    border-radius: 4px;
}

.header_btn ul li.btn_out a,
.header_btn ul li.btn_map a{
    width: 100%;
    display: block;
    padding: 15px 0;
    color: #000;
    position: relative;
}



.header_btn ul li a::before, .header_btn ul li a::after {
    width: 100%;
    position: absolute;
    text-align: center;
    margin: auto;
}

.header_btn ul li a::before {
    height: 16px;
    width: 16px;
    font-family: FontAwesome;
    font-size: 16px;
}

.header_btn ul li.btn_out a::before,
.header_btn ul li.btn_map a::before{
    top: 0;
    left: 0;
    right: 0;
    bottom: auto;
}
.header_btn ul li.btn_req a::before,
.header_btn ul li.btn_res a::before{
    top: 0;
    left: 30px;
    right: auto;
    bottom: 0;
}


.header_btn ul li a::after {
    height: 10px;
    font-size: 10px;
}

.header_btn ul li.btn_out a::after,
.header_btn ul li.btn_map a::after{
    top: auto;
    left: 0;
    right: 0;
    bottom: 0;
}

.header_btn ul li.btn_res a::after,
.header_btn ul li.btn_req a::after{
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0 0 0 10px;
}


.header_btn ul li.btn_res a::before {
    content: '\f073';
}
.header_btn ul li.btn_res a::after {
    content: 'RESERVE';
}
.header_btn ul li.btn_req a::before {
    content: '\f0e0';
}
.header_btn ul li.btn_req a::after {
    content: 'REQUEST';
}
.header_btn ul li.btn_out a::before {
    content: '\f15c';
}
.header_btn ul li.btn_out a::after {
    content: 'OUTLINE';
}
.header_btn ul li.btn_map a::before {
    content: '\f041';
}
.header_btn ul li.btn_map a::after {
    content: 'MAP';
}

@media only screen and (max-width: 800px) {
#HEADER,
#POP_HEADER{
    height: 70px;
}

h1{
display: none;
}

.logo{
height: 70px;
}

.logo img{
height: 70px;
width: auto;
}

.header_btn{
position:absolute;
top:0;
right:50px;
}

.header_txt ul li,
.header_btn ul li{
margin:0;
}

.header_btn ul li.btn_res,
.header_btn ul li.btn_req,
.header_btn ul li.btn_out,
.header_btn ul li.btn_map{
width: 50px;
margin: 0;
}

.header_btn ul li.btn_req a,
.header_btn ul li.btn_res a,
.header_btn ul li.btn_out a,
.header_btn ul li.btn_map a{
    width: 100%;
    display: block;
    padding: 35px 0;
    color: #000;
    position: relative;
    background: none;
    border-radius: 0;
}

.header_btn ul li.btn_req a::before,
.header_btn ul li.btn_res a::before,
.header_btn ul li.btn_out a::before,
.header_btn ul li.btn_map a::before{
    top: 20px;
    left: 0;
    right: 0;
    bottom: auto;
    font-size:24px;
    width: 24px;
    height: 24px;
    text-align: center;
    margin: auto;
}

.header_btn ul li.btn_res a::after,
.header_btn ul li.btn_req a::after,
.header_btn ul li.btn_out a::after,
.header_btn ul li.btn_map a::after{
    font-size: 10px;
    text-align: center;
    top: auto;
    height: 10px;
    left: 0;
    right: 0;
    width: 100%;
    bottom: 13px;
    margin: auto;
    display: block;
    letter-spacing: -0.05em;
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
    padding: 0;
}


}

@media only screen and (max-width: 600px) {

}

@media only screen and (max-width: 600px) {
.logo{
height: 50px;
top:10px;
}

.logo img{
height: 50px;
width: auto;
}

.header_btn{
right:40px;
}
}


@media only screen and (max-width: 480px) {
.logo{
height: 45px;
top:12px;
}

.logo img{
height: 45px;
width: auto;
}

.header_btn ul li.btn_req,
.header_btn ul li.btn_res,
.header_btn ul li.btn_out{
width: 44px;
}

.header_btn ul li.btn_map{
width: 35px;
}
}


/*----------------------------------------------------
   メニュー
----------------------------------------------------*/
#MENU{
display: block;
z-index: 8000;
}

nav{
width:100%;
background-color:#000;
margin: 0;
padding: 0;
}

nav ul {
list-style:none;
display:-webkit-box;
display:-moz-box;
display:-webkit-flexbox;
display:-moz-flexbox;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
-webkit-box-pack:justify;
-moz-box-pack:justify;
-webkit-flex-pack:justify;
-moz-flex-pack:justify;
-ms-flex-pack:justify;
-webkit-justify-content:space-between;
-moz-justify-content:space-between;
justify-content:space-between;
max-width:900px;
width: 95%;
margin:0 auto;
padding:0;
}

.header_btn a,
.under_btn a,
nav ul li:nth-child(2) a,nav ul li:nth-child(3) a,nav ul li:nth-child(4) a,nav ul li:nth-child(5) a,nav ul li:nth-child(6) a,nav ul li:nth-child(7) a,nav ul li:nth-child(8) a,
.under_nav li:nth-child(2) a,.under_nav li:nth-child(3) a,.under_nav li:nth-child(4) a,.under_nav li:nth-child(5) a,.under_nav li:nth-child(6) a,.under_nav li:nth-child(7) a ,.under_nav li:nth-child(8) a{
	pointer-events:none;
	color: #676464;
}

nav ul li,
nav.under_nav ul li{
-webkit-box-flex:1;
-moz-box-flex:1;
-ms-flex-positive:1;
-webkit-flex:1 0 auto;
-moz-flex:1 0 auto;
flex:1 0 auto;
color: #fff;
padding: 10px 0;
font-size:14px;
text-align: center;
}

nav.under_nav ul li{
font-size:10px;
}

nav ul li > div,
nav.under_nav ul li > div{
opacity:0.5;
filter: alpha(opacity=50);        /* ie lt 8 */
-ms-filter: "alpha(opacity=50)";  /* ie 8 */
-moz-opacity:0.5;                 /* FF lt 1.5, Netscape */
-khtml-opacity: 0.5;              /* Safari 1.x */
}

nav ul li a,
nav.under_nav ul li a{
color:#fff;
text-decoration: none;
width: 100%;
display: block;
opacity:1.0;
filter: alpha(opacity=100);        /* ie lt 8 */
-ms-filter: "alpha(opacity=100)";  /* ie 8 */
-moz-opacity:1.0;                 /* FF lt 1.5, Netscape */
-khtml-opacity: 1.0;              /* Safari 1.x */
}

nav ul li.current a,
nav.under_nav ul li.current a{
color:#61c1be;
}


nav ul li:nth-child(6){
position: relative;
}

/*nav ul li:nth-child(6)::before{
position: absolute;
top:-1px;
right: -1px;
margin: auto;
content: "NEW";
color: #000;
text-align: center;
font-size:10px;
width: 35px;
padding: 2px 0 0 0;
height: 12px;
line-height: 1;
font-weight: 700;
transform: scale(0.8);
background: #ff3019; /* Old browsers */
/*background: -moz-linear-gradient(top, #ff3019 0%, #cf0404 100%); /* FF3.6-15 */
/*background: -webkit-linear-gradient(top, #ff3019 0%,#cf0404 100%); /* Chrome10-25,Safari5.1-6 */
/*background: linear-gradient(to bottom, #ff3019 0%,#cf0404 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3019', endColorstr='#cf0404',GradientType=0 ); /* IE6-9 */
/*}*/


nav.under_nav ul li:nth-child(6)::before{
content: "";
width: 0;
height: 0;
}

@media only screen and (max-width: 800px) {
#MENU{
border-bottom: none;
border-top: none;
display: none;
background: RGBA(255,255,255,0.7);
position: absolute;
top:70px;
left: 0;
right: 0;
margin: auto;
}

nav ul,
nav.under_nav ul{
width: 100%;
}

nav ul li,
nav.under_nav ul li{
width: 25%;
box-sizing: border-box;
border-bottom: 1px solid rgba(255,255,255,0.8);
border-left: 1px solid rgba(255,255,255,0.8);
}

nav.under_nav ul li{
border-bottom: none;
border-left: none;
}
}

@media screen and (max-width:600px){
nav ul li,
nav.under_nav ul li{
width: 50%;
}
}

/*----------------------------------------------------
   スマホ用メニュー
----------------------------------------------------*/

#openMenu,
#closeMenu{
display:none;
}


@media only screen and (max-width: 800px) {
#openMenu,
#closeMenu{
position:absolute;
top:0;
right:0;
height:70px;
width: 60px;
display:block;
background: #000;
color: #fff;
cursor: pointer;
}

#openMenu{
z-index: 8000;
}
#closeMenu{
z-index: 7999;
}



#openMenu div,
#closeMenu div {
position: relative;
width: 100%;
height: 100%;
}

#openMenu div:before,
#closeMenu div:before{
position: absolute;
font-family: FontAwesome;
font-size:24px;
text-align: center;
width: 24px;
height: 24px;
top:20px;
left:0;
right: 0;
bottom:auto;
margin: auto;
display: block;
}

#openMenu div:before{
content:'\f0c9';
}

#closeMenu div:before{
content:'\f00d';
}

#openMenu div:after,
#closeMenu div:after{
position: absolute;
font-size:10px;
text-align: center;
top:auto;
height: 10px;
left:0;
right: 0;
bottom:13px;
margin: auto;
display: block;
letter-spacing: -0.05em;
-webkit-transform:scale(0.8);
-moz-transform:scale(0.8);
-ms-transform:scale(0.8);
-o-transform:scale(0.8);
transform:scale(0.8);
}

#openMenu div:after{
content:'MENU';
}

#closeMenu div:after{
content:'CLOSE';
}
}

@media only screen and (max-width: 600px) {
#openMenu,
#closeMenu{
width: 40px;
}
}

/*----------------------------------------------------
   フッター
----------------------------------------------------*/
#POP_FOOTER,
#FOOTER{
width:100%;
background:#61c1be;
margin: 0 auto;
padding:30px 0;
}
#POP_FOOTER > ul,
#FOOTER > ul{
list-style:none;
display:-webkit-box;
display:-moz-box;
display:-webkit-flexbox;
display:-moz-flexbox;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
-webkit-box-pack:justify;
-moz-box-pack:justify;
-webkit-flex-pack:justify;
-moz-flex-pack:justify;
-ms-flex-pack:justify;
-webkit-justify-content:space-between;
-moz-justify-content:space-between;
justify-content:space-between;
max-width: 900px;
width: 95%;
margin: 0 auto;
}
#POP_FOOTER > ul{
max-width: 720px;
width:100%;
}

#POP_FOOTER > ul >li,
#FOOTER > ul >li{
        display:-webkit-box;
        display:-moz-box;
        display:-ms-flexbox;
        display:-webkit-flex;
        display:-moz-flex;
        display:flex;
        -webkit-box-align:center;
        -moz-box-align:center;
        -ms-flex-align:center;
        -webkit-align-items:center;
        -moz-align-items:center;
        align-items:center;
        -webkit-box-pack:center;
        -moz-box-pack:center;
        -webkit-flex-pack:center;
        -moz-flex-pack:center;
        -ms-flex-pack:center;
        -webkit-justify-content:center;
        -moz-justify-content:center;
        justify-content:center;
}

@media screen and (max-width:965px){
#POP_FOOTER > ul,
#FOOTER > ul{
    -webkit-box-pack:center;
    -moz-box-pack:center;
    -webkit-flex-pack:center;
    -moz-flex-pack:center;
    -ms-flex-pack:center;
    -webkit-justify-content:center;
    -moz-justify-content:center;
    justify-content:center;
}
#POP_FOOTER > ul > li,
#FOOTER > ul >li{
width: 50%;
margin: 0 0 20px 0;
}

#POP_FOOTER > ul >li:last-child,
#FOOTER > ul >li:last-child{
width: 100%;
margin: 0;
}
}


#COPY{
color:#fff;
background:#000;
font-size:10px;
padding:10px 0;
width: 100%;
margin: 0 auto;
text-align: center;
}


#INFO{
padding: 30px 0;
}

.info{
font-size:28px;
}

.info2{
	font-size: 70px;}
   
.info2 p{
    font-size: 28px;
    padding: 10px 0 0 0;}

.info p{
     font-size: 20px;
     line-height: 32px;
    padding-top: 27px;
}
.sp {display: none;}

@media only screen and (max-width: 600px) {
.info_sp{font-size:20px;
padding: 10px 0 0 0;}
    
.info{
font-size:20px;
}
	
.info2{
    font-size: 48px;
    
    margin: auto;
}
	
.info2 p {
    font-size: 20px;
    padding: 25px 0 0 0;
}
	
.sp {display: block!important;}

.info p{
    font-size: 15px;
    line-height: 25px;
    padding-top: 12px;
    letter-spacing: -0.5px;
}	
}

@media only screen and (max-width: 600px) {
.info_sp2{font-size:17px;
padding: 10px 0 0 0;}
}


.under_btn ul {
list-style:none;
display:-webkit-box;
display:-moz-box;
display:-webkit-flexbox;
display:-moz-flexbox;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
-webkit-box-pack:justify;
-moz-box-pack:justify;
-webkit-flex-pack:justify;
-moz-flex-pack:justify;
-ms-flex-pack:justify;
-webkit-justify-content:space-between;
-moz-justify-content:space-between;
justify-content:space-between;
max-width: 650px;
width: 95%;
margin:0 auto;
padding:0;
}


.under_btn ul li{
width: 300px;
}

.under_btn ul li a{
    width: 100%;
    height: 100px;
    display: block;
    color: #000;
    background: #61c1be;
    position: relative;
    border-radius: 4px;
}
.under_btn ul li a::before, .under_btn ul li a::after {
    position: absolute;
    text-align: center;
    margin: auto;
}

.under_btn ul li a::before {
    width: 30px;
    top: 0;
    left: 70px;
    right: auto;
    bottom: 0;
    height: 30px;
    font-family: FontAwesome;
    font-size: 30px;
}
.under_btn ul li a::after {
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 16px;
    font-size: 16px;
    letter-spacing: 3px;
    padding: 0 0 0 20px;
}


.under_btn ul li.btn_res a::before {
    content: '\f073';
}
.under_btn ul li.btn_res a::after {
    content: 'RESERVE';
}
.under_btn ul li.btn_req a::before {
    content: '\f0e0';
}
.under_btn ul li.btn_req a::after {
    content: 'REQUEST';
}

@media screen and (max-width: 680px){
.under_btn ul {
    -webkit-box-pack:center;
    -moz-box-pack:center;
    -webkit-flex-pack:center;
    -moz-flex-pack:center;
    -ms-flex-pack:center;
    -webkit-justify-content:center;
    -moz-justify-content:center;
    justify-content:center;
}

.under_btn ul li{
margin: 0 0 10px 0;
}

.under_btn ul li a{
    height: 80px;
}
}


/*----------------------------------------------------
   pop_btn
----------------------------------------------------*/
.pop_btn{
width: 100%;
padding: 20px 0;
margin: 0;
}
.pop_btn ul{
list-style:none;
display:-webkit-box;
display:-moz-box;
display:-webkit-flexbox;
display:-moz-flexbox;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-lines:single;
-moz-box-lines:single;
-webkit-flex-wrap:nowrap;
-moz-flex-wrap:nowrap;
-ms-flex-wrap:none;
flex-wrap:nowrap;
-webkit-box-direction:normal;
-moz-box-direction:normal;
-webkit-box-orient:horizontal;
-moz-box-orient:horizontal;
-webkit-flex-direction:row;
-moz-flex-direction:row;
flex-direction:row;
    -webkit-box-pack:center;
    -moz-box-pack:center;
    -webkit-flex-pack:center;
    -moz-flex-pack:center;
    -ms-flex-pack:center;
    -webkit-justify-content:center;
    -moz-justify-content:center;
    justify-content:center;
padding:0;
width:100%;
margin:0 auto;
}
	
.pop_btn ul li{
width:119px;
margin:0 5px;
padding:0;
}


@media print{
  .pop_btn{
  display: none;
  }
}

/*----------------------------------------------------
	列
----------------------------------------------------*/
.col01 > ul,
.col02 > ul,
.col02_inner > ul,
.col03 > ul,
.col04 > ul{
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
width: 100%;
}

ul.col_c{
-webkit-box-pack:center;
-moz-box-pack:center;
-webkit-flex-pack:center;
-moz-flex-pack:center;
-ms-flex-pack:center;
-webkit-justify-content:center;
-moz-justify-content:center;
justify-content:center;
}

ul.col_s{
-webkit-box-pack:justify;
-moz-box-pack:justify;
-webkit-flex-pack:justify;
-moz-flex-pack:justify;
-ms-flex-pack:justify;
-webkit-justify-content:space-between;
-moz-justify-content:space-between;
justify-content:space-between;

}

ul.col_l{
-webkit-box-pack:start;
-moz-box-pack:start;
-webkit-flex-pack:start;
-moz-flex-pack:start;
-ms-flex-pack:start;
-webkit-justify-content:flex-start;
-moz-justify-content:flex-start;
justify-content:flex-start;
}



@media print{

 body{
  overflow-y: visible;
  overflow-x: visible;
 }

#PAGE{
overflow-y: visible;
}

.out_area {
   page-break-inside: avoid;
}


#map  #PAGE{
	width:80%;
	margin:0 auto;
	text-align:center;
}

#map  #PAGE img{
	width:80%;
}
}

.last span{
    font-size: 40px;
    display: block;
    padding-bottom: 10px;
}

@media screen and (max-width: 680px){
.sp {
display: block;	
	}
.last span{
    font-size: 35px;
    padding-bottom: 15px;
}
}
