/* modal */
.modal{
display: none;
position: relative;
z-index: 20;
}
.modal .modalBody{
position: fixed;
/* top: -100%; */
top: -96%;
left: -100%;
right: -100%;
bottom: -100%;
margin: auto;
z-index: 1000;
background: #fff;
color: #333;
width: 90%;
max-width: 880px;
height: calc(94% - 32px);
max-height: 893px;
font-size: 14px;
box-sizing: border-box;
}
.modal iframe{
width: 100%;
height: 100%;
}
.modal .mdCloseBtn01{
position: absolute;
top: -38px;
right: 0;
width: 36px;
height: 36px;
cursor: pointer;
z-index: 1000;
}
.modal .mdCloseBtn01:before,
.modal .mdCloseBtn01:after{
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: block;
width: 100%;
height: 2px;
background: #FFF;
margin: auto;
}
.modal .mdCloseBtn01:before{ transform: rotateZ( 45deg); }
.modal .mdCloseBtn01:after{ transform: rotateZ(-45deg); }
.modal .mdBg{
position: fixed;
top: 0;
left: 0;
z-index: 999;
height: 100%;
width: 100%;
padding: 10px;
background: #000;
opacity: 0.8;
}
@media screen and (min-width: 750px){
.modal .mdCloseBtn01{
top: -48px;
width: 42px;
height: 42px;
}
}
.modal.md_err .modalBody{
max-width: 600px;
max-height: 250px;
}
.modal.md_err .modalBody .md_title{
margin-bottom: 4px;
font-weight: bold;
font-size: 16px;
}
.modal.md_err .mdTitle{
position: absolute;
top: -32px;
left: 0;
color: #fff;
font-size: 18px;
font-weight: bold;
}
.modal.md_err .modalInner{
display: flex;
flex-direction: column;
height: 100%;
padding: 30px;
overflow: auto;
box-sizing: border-box;
}
.modal.md_err .modalInner .button{
width: 100%;
margin-top: auto;
padding: 11px;
border: none;
background: #E6001B;
text-align: center;
font-size: 16px;
color: #FFF;
cursor: pointer;
}
.modal.md_err .modalInner .line{
margin-bottom: .8em;
line-height: 1.4;
}
.modal.md_err .modalInner .bold{
font-weight: bold;
}
/* 縺薙％縺ｾ縺ｧ繝｢繝ｼ繝繝ｫ **********/
/* 縺薙％縺九ｉ繧ｳ繝ｳ繝�Φ繝� **********/
.pop_content{
font-family:'繝｡繧､繝ｪ繧ｪ', 'Meiryo', '繝偵Λ繧ｮ繝手ｧ偵ざ繧ｷ繝�け', 'Hiragino Sans', '繝偵Λ繧ｮ繝手ｧ偵ざ ProN W3', sans-serif
}
.pop_content .pop_bg{
min-height: 40px;
background: repeating-linear-gradient(135deg, #FFF000, #FFF000 6px, #FFF666 6px, #FFF666 13px);
}
.pop_content .pop_inner{
width: 90%;
max-width: 720px;
margin: 0 auto;
}
.pop_content .pop_head{
position: relative;
margin-bottom: 20px;
padding: 15px 0 0;
}
.pop_content .maintitle{
width: 52%;
max-width: 300px;
margin: 0 auto;
}
.pop_content .title_pc{
display: none;
}
.pop_content .title_sp{
display: block;
}
.pop_content .subtitle{
width: 80%;
max-width: 200px;
margin: 0 auto 10px;
}
.pop_content .pop_text{
font-size: 14px;
margin-bottom: 20px;
}
.pop_content .rinji_img01{
position: absolute;
z-index: 3;
left: 5%;
bottom: -5px;
width: 14%;
/* min-width: 60px; */
transition: transform .5s;
overflow: visible;
}
.pop_content .rinji_img02{
position: absolute;
z-index: 3;
right: 5%;
bottom: -5px;
width: 12%;
/* min-width: 50px; */
transition: transform .5s;
overflow: visible;
}
.pop_content .rsv_label{
position: absolute;
top: -15px;
left: 5%;
width: 15%;
max-width: 65px;
}
/* table_area ***/
.table_area{
width: 100%;
border-collapse: collapse;
}
.table_area tr{
display: flex;
flex-direction: column;
border-top: solid 1px #CCCCCC;
border-bottom: solid 1px #CCCCCC;
}
.table_area tr:last-child{
border-top: none;
}
.table_area th {
text-align: start;
width: 100%;
height: auto;
padding: 0 20px;
background-color: #F2F9F5;
vertical-align: middle;
font-size: 14px;
line-height: 2;
}
.table_area td {
width: 100%;
padding: 20px 20px;
vertical-align: middle;
font-size: 16px;
}
.table_area td p{
margin-bottom: 15px;
font-size: 14px;
line-height: 1.5;
}
.table_area td p:last-child{
margin-bottom: 0;
}
.table_area td .address{
line-height: 1.8;
}
.table_area td .datetime{
display: inline-block;
font-size: 18px;
font-weight: bold;
margin: 0 3px;
}
.table_area td .sui{
display: inline-block;
height: 24px;
width: 24px;
margin: 0 10px 0 20px;
padding: 5px;
border-radius: 50%;
background-color: #009142;
color: white;
text-align: center;
vertical-align: text-bottom;
font-size: 14px;
font-weight: bold;
line-height: 1;
}
.table_area td .nichi{
display: inline-block;
height: 24px;
width: 24px;
margin: 0 10px 0 8px;
padding: 5px;
border-radius: 50%;
background-color: #E31B13;
color: white;
text-align: center;
vertical-align: text-bottom;
font-size: 14px;
font-weight: bold;
line-height: 1;
}
/* rsv_area ***/
.rsv_area{
padding-bottom: 15px;
}
.rsv_area .rsv_flx{
display: flex;
flex-direction: column;
}
.rsv_area .rsv_text{
max-width: 414px;
margin: 20px auto 12px;
text-align: center;
font-size: 16px;
font-weight: bold;
}
.rsv_area .inline{
display: inline-block;
}
.rsv_area .rsv_btn_box{
width: 100%;
max-width: 320px;
margin: 0 auto;
}
.rsv_area .rsv_link_btn{
display: inline-block;
width: 100%;
max-width: 340px;
height: 50px;
margin: 0 auto;
background-color: #E31B13;
color: white;
border-radius: 15px;
box-shadow: 0 5px #9F130D;
box-sizing: content-box;
text-align: center;
font-size: 16px;
font-family: '驕翫ざ繧ｷ繝�け','繝偵Λ繧ｮ繝手ｧ偵ざ繧ｷ繝�け', 'Hiragino Sans','Hiragino Kaku Gothic ProN', sans-serif;
font-weight: bold;
line-height: 50px;
text-decoration: none;
transform: translateY(0);
transition: box-shadow .1s ease, transform .1s ease;
}
.rsv_area .rsv_link_btn:hover{
opacity: 1;
background: #F22722;
box-shadow: 0 1px #D7231E;
transform: translateY(4px);
}
.rsv_area .rsv_tel_box{
width: 100%;
max-width: 320px;
margin: 20px auto 10px;
text-align: center;
}
.rsv_area .tel_num{
position: relative;
margin-left: 30px;
font-size: 22px;
font-weight: bold;
color:#009142;
}
.rsv_area .tel_num a{
font-size: 20px;
color:#009142;
}
.rsv_area .tel_num::before{
position: absolute;
top: 0;
bottom: 0;
content: url('../images/ico_tel02.png');
display: block;
width: 30px;
height: 3dvh;
}
.pop_content .host_info{
text-align: center;
margin: 0 auto;
font-size: 14px;
line-height: 40px;
}
@media screen and (min-width: 750px){
.pop_content .pop_head{
margin-bottom: 40px;
padding: 50px 0 10px;
}
.pop_content .maintitle{
max-width: 550px;
width: 65%;
}
.pop_content .title_pc{
display: block;
}
.pop_content .title_sp{
display: none;
}
.pop_content .subtitle{
width: 80%;
max-width: 258px;
margin: 0 auto 15px;
}
.pop_content .rsv_label{
left: 11%;
width: 11%;
max-width: 90px;
}
.pop_content .pop_text{
font-size: 16px;
margin-bottom: 40px;
}
.pop_content .rinji_img01{
max-width: 120px;
width: 14%;
left: 2%;
bottom: -15px;
/* left: 100px; */
}
.pop_content .rinji_img02{
max-width: 100px;
width: 12%;
right: 2%;
bottom: -15px;
/* right: 100px; */
}
.table_area td p{
font-size: 16px;
}
.table_area tr{
display: block
}
.table_area th,td{
/* border-top: solid 1px #CCCCCC;
border-bottom: solid 1px #CCCCCC; */
}
.table_area th {
width: 150px;
height: auto;
padding: 0;
font-size: 16px;
text-align: center;
}
.table_area td {
width: 590px;
padding: 20px 30px;
font-size: 16px;
}
.table_area td .datetime{
font-size: 20px;
}
.table_area td .sui{
margin: 0 20px;
}
.table_area td .nichi{
margin: 0 20px 0 7px;
}
.rsv_area{
padding-bottom: 50px;
}
.rsv_area .rsv_flx{
display: flex;
flex-direction: row;
}
.rsv_area .rsv_text{
margin: 40px auto 25px;
font-size: 18px;
}
.rsv_area .rsv_btn_box{
width: 50%;
max-width: none;
margin: 0;
padding-right: 20px;
}
.rsv_area .rsv_link_btn{
height: 65px;
font-size: 16px;
line-height: 65px;
}
.rsv_area .rsv_tel_box{
width: 50%;
max-width: none;
padding-left: 30px;
margin: 0;
text-align: left;
}
.rsv_area .tel_num{
font-size: 24px;
}
}