@charset "utf-8";


/* ---------------------------------------------------------------------------------
sample */

#contents{padding-bottom:50px;}

.sec{padding-top: 100px;}

@media(max-width:750px){

}


/* ---------------------------------------------------------------------------------
mainVisual */

#subVisual{border-bottom:13px solid #ddd;margin-bottom: 80px; height: 210px; width: 100%; display: table; background:#444 url(../images/top/pageImage01.jpg) no-repeat center center; background-size: cover;}
#subVisual h1{ width: auto; display: table-cell; vertical-align: middle; text-align: center;}
#subVisual h1 img{ width: 300px;}

#subVisual.about{background:#444 url(../images/subVisual/about.jpg) no-repeat center center; background-size: cover;}
#subVisual.guestroom{background:#444 url(../images/subVisual/guestroom.jpg) no-repeat center center; background-size: cover;}
#subVisual.frontdougs{background:#444 url(../images/subVisual/frontdougs.jpg) no-repeat center center; background-size: cover;}
#subVisual.location{background:#444 url(../images/subVisual/location.jpg) no-repeat center center; background-size: cover;}
#subVisual.activity{background:#444 url(../images/subVisual/activity.jpg) no-repeat center center; background-size: cover;}
#subVisual.gallery{background:#444 url(../images/subVisual/gallery.jpg) no-repeat center center; background-size: cover;}
#subVisual.access{background:#444 url(../images/subVisual/access.jpg) no-repeat center center; background-size: cover;}
#subVisual.qa{background:#444 url(../images/subVisual/qa.jpg) no-repeat center center; background-size: cover;}
#subVisual.contact{background:#444 url(../images/subVisual/contact.jpg) no-repeat center center; background-size: cover;}
#subVisual.company{background:#444 url(../images/subVisual/company.jpg) no-repeat center center; background-size: cover;}
#subVisual.information{background:#444 url(../images/subVisual/information.jpg) no-repeat center center; background-size: cover;}


@media(max-width:750px){

#subVisual{ height: 400px; width: 100%; display: table; background:#444 url(../images/top/pageImage01.jpg) no-repeat center center; background-size: cover;}
#subVisual h1{ width: auto; display: table-cell; vertical-align: middle; text-align: center;}
#subVisual h1 img{ width: 500px;}
    
}

/* ---------------------------------------------------------------------------------
crmBox */


.crmOuter{ width: 1000px; margin: 0 auto;}

@media(max-width:750px){

.crmOuter{ width: 700px; margin: 0 auto;}
}








.photo2crm{ margin-bottom: 30px;}
.photo2crm li{ width: 50%; float: left; margin-bottom: 20px;}
.photo2crm li img{ width: 100%;}


.photo2crm.zeroMargin{ margin-bottom: 0;}
.photo2crm.zeroMargin li{ margin-bottom: 0;}

@media(min-width:751px){
.photo2crm.margined li{ width: 49%; margin-right: 2%; float: left;}
.photo2crm.margined li:nth-child(2n){margin-right: 0%;}
}

.photo2crm:before,
.photo2crm:after {content: " ";display:table;}
.photo2crm:after {clear: both;}
.photo2crm{*zoom: 1;}


@media(max-width:750px){

.photo2crm{ margin-bottom: 30px;}
.photo2crm li{ width:600px; margin: 0 auto 50px; float: none;}
.photo2crm li img{ width: 100%;}
    
    
.photo2crm.zeroMargin{ margin: 0 auto 75px !important;padding:0 !important;}
.photo2crm.zeroMargin li{ margin-bottom: 30px;}
}








.photo3crm{ margin-bottom: 30px;}
.photo3crm li{ width: 33%; float: left;}
.photo3crm li img{ width: 100%;}
@media(min-width:751px){
.photo3crm.margined li{ width: 32%; margin-right: 2%; float: left;}
.photo3crm.margined li:nth-child(3n){margin-right: 0%;}
}
.photo3crm:before,
.photo3crm:after {content: " ";display:table;}
.photo3crm:after {clear: both;}
.photo3crm{*zoom: 1;}


@media(max-width:750px){
.photo3crm{ margin-bottom: 30px;}
.photo3crm li{ width:600px; margin: 0 auto 25px; float: none;}
.photo3crm li img{ width: 100%;}
}










.photo4crm{ margin-bottom: 80px;}
.photo4crm li{ width: 25%; float: left; margin-bottom: 10px;}
.photo4crm li img{ width: 100%;}
@media(min-width:751px){
.photo4crm.margined li{ width: 242px; margin-right: 10px; float: left;}
.photo4crm.margined li:nth-child(4n){margin-right: 0%;}
}
.photo4crm:before,
.photo4crm:after {content: " ";display:table;}
.photo4crm:after {clear: both;}
.photo4crm{*zoom: 1;}



@media(max-width:750px){

.photo4crm{ width: 600px; margin: 0 auto 30px; margin-bottom: 100px;}
.photo4crm li{ width: 290px; margin-right: 20px; float: left; margin-bottom: 20px;}
    .photo4crm li:nth-child(2n){margin-right: 0;}
.photo4crm li img{ width: 100%;}
}




/* ---------------------------------------------------------------------------------
about */

section#Intro{padding-bottom:50px;}

.introText{ line-height: 2em; text-align: center; margin-bottom: 80px;}

#subPage section.sec h3{ width: 500px; text-align: left; margin-bottom: 50px;}
#subPage section.sec p.introText2{ line-height: 2em; text-align: left;padding-left:25px; margin-bottom: 50px;}

#subPage section.sec >.inner{width: 1000px; margin: 0 auto;}
#subPage section.sec >.inner.mid{width: 900px; margin: 0 auto;}



@media(max-width:750px){
#subPage section.sec >.inner{width: 700px; margin: 0 auto;}
#subPage section.sec >.inner.mid{width: 700px; margin: 0 auto;}
.introText{ font-size: 28px; text-align:left;padding:0 50px;}
#subPage section.sec h3{ width: 90%; text-align: left; margin-bottom: 50px;}
#subPage section.sec p.introText2{ font-size: 26px; text-align:left;padding:0 50px;}

}
/* ---------------------------------------------------------------------------------
guestroom */


.roomList{}
.roomListArea{display: block; border-bottom: 2px solid #ddd; }
.roomDetail{ width: 35%; float: left;}
.roomMadori{ width: 65%; float:right;}

.rev .roomDetail{ width: 35%; float:right;}
.rev .roomMadori{ width: 65%; float:left;}

.roomDetail { background: #61c4d3; border-right: 10px solid #dadada; display: table;}
.rev .roomDetail { border-right: none; border-left: 10px solid #dadada}

.roomDetail >.inner{padding: 60px; display: table-cell; vertical-align: middle;}
.roomDetail h3{max-width: 250px; margin-bottom: 30px;}
.roomDetail h3 img{width: 100%;}
.roomDetail .detail01{font-size: 20px; margin-bottom: 20px;}
.roomDetail .detail02{font-size: 16px;}

.roomDetail p span{ font-size: 80%;}

.roomMadori >.inner{padding: 50px 40px;}
.roomMadori img{width: 100%;}

.roomListArea:before,
.roomListArea:after {content: " ";display:table;}
.roomListArea:after {clear: both;}
.roomListArea{*zoom: 1;}


@media(max-width:750px){

.roomListArea{display: block; border-bottom: 10px solid #dadada; }
.roomDetail{ width: 100%; float:none;}
.roomMadori{ width: 100%; float:none;}

.rev .roomDetail{ width: 100%; float:none;}
.rev .roomMadori{ width: 100%; float:none;}

.roomDetail { background: #61c4d3; border-right: 0;border-bottom: 0; display: table;}
.rev .roomDetail { border-right: none; border-left: none;}


.roomDetail h3{max-width: 100%; margin-bottom: 30px;}
.roomDetail h3 img{width: 100%;}
.roomDetail .detail01{font-size: 40px; margin-bottom: 20px;}
.roomDetail .detail02{font-size: 30px;}

.roomMadori >.inner{padding: 50px 40px;}
.roomMadori img{width: 100%;}
}


#facilities{}
#facilities >.inner{ width: 900px; margin: 0 auto;}


.fasListOuter{ margin-bottom: 50px;}
.fasList{ width: 48%; margin-right: 3%; float: left;}
.fasList:nth-child(2n){margin-right: 0;}
.fasList figure{}
.fasList figcaption{ padding: 20px 15px 15px; font-size: 24px; font-family: serif;}
.fasList p{padding: 0 15px 50px; font-size: 16px;}
.fasList img{width: 100%;}

.fasListOuter:before,
.fasListOuter:after {content: " ";display:table;}
.fasListOuter:after {clear: both;}
.fasListOuter{*zoom: 1;}


@media(max-width:750px){
#facilities >.inner{ width: auto; margin: 0 auto;}
.fasList{ width: 100%; margin-right: 0; float: none;}
    
.fasList figcaption{ padding: 30px; font-size: 36px; font-family: serif;}
.fasList p{padding: 0 30px 70px; font-size: 28px;}


}



/* ---------------------------------------------------------------------------------
frontdougs */

.rentalBox{ width: 600px; margin: 0 auto; border: 2px solid #ccc;padding: 40px; margin-bottom: 80px;}
.rentalBox h3{ text-align: left !important; font-size: 20px; color: #26a2c6; margin-bottom: 20px !important; }
.rentalBox p{}


@media(max-width:750px){

.rentalBox{ width: 650px; margin: 0 auto; border: 2px solid #ccc;padding: 40px; margin-bottom: 80px;}
.rentalBox h3{  font-size: 30px;  }
.rentalBox p{font-size: 28px; ;line-height: 1.4em;}
}

.dougsList{}
.dougsListArea{display: block;color: #fff; }
.dougsDetail{ width: 40%; float: left;}
.dougsPhoto{ width: 60%; float:right; background: url(../images/frontdougs/image02a.jpg) no-repeat center center; background-size: cover;}

.rev .dougsDetail{ width: 40%; float:right; }
.rev .dougsPhoto{ width: 60%; float:left;
background: url(../images/frontdougs/image02b.jpg) no-repeat center center; background-size: cover;}

.dougsDetail { background: #380d0d;  display: table; border-right: none;}
.rev .dougsDetail {background: #681409; border-right: none;  }

.dougsDetail >.inner{padding: 60px; display: table-cell; vertical-align: middle;}
.dougsDetail h3{max-width: 250px; margin-bottom: 20px;}
.dougsDetail h3 img{width: 100%;}
.dougsDetail .detail01{ margin-bottom: 20px;}
.dougsDetail .detail01 img{width: 80%}
.dougsDetail .detail02{font-size: 14px;}

.rev .dougsDetail .detail02{margin-bottom: 20px;}

.dougsPhoto >.inner{padding:0;}
.dougsPhoto img{width: 100%;}

.dougsListArea:before,
.dougsListArea:after {content: " ";display:table;}
.dougsListArea:after {clear: both;}
.dougsListArea{*zoom: 1;}


@media(max-width:750px){


.dougsDetail{ width: auto; float: none;}
.dougsPhoto{ width: auto; float:none; height: 500px;}

.rev .dougsDetail{ width: 100%; float:none; }
.rev .dougsPhoto{ width: auto; float:none;
background: url(../images/frontdougs/image02b.jpg) no-repeat center center; background-size: cover;}

.dougsDetail { background: #380d0d;  display: table;}
.rev .dougsDetail {background: #681409; border-right: 0px; }

.dougsDetail >.inner{padding: 60px; display: table-cell; vertical-align: middle;}
.dougsDetail h3{max-width: 80%; margin-bottom: 20px;}
.dougsDetail h3 img{width: 100%;}
.dougsDetail .detail01{ margin-bottom: 20px; }
.dougsDetail .detail01 img{width: 80%}
.dougsDetail .detail02{font-size: 28px;}

.rev .dougsDetail .detail02{margin-bottom: 20px;}

.dougsPhoto >.inner{padding:0;}
.dougsPhoto img{width: 100%;}
}



#dougsExpress{}
#dougsExpress >.inner{ width: 1000px; margin: 0 auto;}

p.dougsLogo{ text-align: center; margin-bottom: 50px;}
p.dougsLogo img{ width: 440px;}


.txt2crmArea{}
.txt2crmArea .left{ float: left;width: 48%; margin-right: 4%; padding-bottom: 30px;}
.txt2crmArea .right{ width: 48%; float: left; padding-bottom: 30px;}

.sec .txt2crmArea h3{ text-align: left; font-size: 24px; font-family: serif; padding-left:15px; border-left: 3px solid #D87217;padding:10px 15px; font-weight: normal; margin-bottom: 20px !important;}
.txt2crmArea .price{ padding: 0 20px 30px;}
.txt2crmArea .price span{font-size: 90%; font-weight: normal;}
.txt2crmArea .txt{ padding: 0 0 30px 20px;}
.txt2crmArea .bbqmenu{ margin-left: 20px; padding: 20px 0 30px 20px;border-left: 1px solid #681409; color: #c00505;}

.dougsOtherP{ clear: both; text-align: center; margin-bottom:30px;}

.reserveBtn{ text-align: center; position: relative; margin-bottom: 80px; }
.reserveBtn img{width: 400px;}

#dougsExpress .txt2crmArea .left.single{
    border-top: 1px dashed #aaa;padding-top: 40px;
    width: 500px; float: none;margin: 0 auto;padding-bottom: 30px;margin-top: -20px;
}

#dougsExpress .txt2crmArea .left.single .price{font-weight: bold; color: #666}

@media(max-width:750px){
#dougsExpress >.inner{ width: 600px; margin: 0 auto;}

.txt2crmArea .left{ float: none;width: auto; margin:0 auto; padding-bottom: 30px;}
.txt2crmArea .right{float: none;width: auto; margin:0 auto;}

.sec .txt2crmArea h3{ font-size: 44px;  border-left: 6px solid #D87217;padding:20px 30px;margin-bottom: 30px !important;}
.txt2crmArea .price{ padding: 0 20px 30px; font-size: 32px}
.txt2crmArea .txt{ padding: 0 0 30px 20px; font-size: 28px;}
.txt2crmArea .bbqmenu{ margin-left: 20px; padding: 20px 0 30px 20px;border-left: 2px solid #681409; color: #c00505; margin-bottom: 80px;}
.reserveBtn img{width: 650px;}
    
    #dougsExpress .txt2crmArea .left.single{
    border-top: 1px dashed #aaa;padding: 40px 0 30px;
        margin: 0 50px 100px;
    width: auto; float: none;margin-top: -20px;
}
    
    
}


.photo2crm{}

.linkBlock{ background: url(../images/location/image01a.jpg) no-repeat center center; background-size: cover;
height: 400px; float: left; width: 50%;}
.linkBlock .inner{display: block; width: 100%; height: 400px; background: url(../images/top/shadow01.png) repeat-x center bottom;background-size:100% 100%;position: relative; bottom: 0;}
.linkBlock p{position: absolute; bottom: 20px; font-size: 20px; letter-spacing: 0.2em; right: 0; width:100%; color: #fff; text-align: center;}

.location01{background: url(../images/location/image01a.jpg) no-repeat center center; background-size: cover;}
.location02{background: url(../images/location/image01b.jpg) no-repeat center center; background-size: cover;}
.location03{background: url(../images/location/image01c.jpg) no-repeat center center; background-size: cover;}
.location04{background: url(../images/location/image01d.jpg) no-repeat center center; background-size: cover;}

@media(max-width:750px){

}


.act{ width: 750px; margin: 0 auto 80px auto;;}
.act h2{ border-radius: 8px; background: #51454B; font-size: 18px; color: #fff; text-align: center;padding:8px 0;margin-bottom: 30px;}
.act dl{ display: table; margin-bottom: 30px;}
.act dt{ display: table-cell; width: 50%;}
.act dt img{ width: 100%;}
.act dd{ display: table-cell; vertical-align: middle; padding-left: 20px;}
.act h3{ font-size: 18px; margin-bottom: 20px;}
.act .phone{ margin-bottom: 20px;}

.act .moreBtn{ text-align: left;}

@media(max-width:750px){

.act{ width: 700px; margin: 0 auto 100px auto;}
    .act h2{ font-size: 36px;padding:19px 0;}
.act dl{ display: block; margin-bottom: 30px;}
.act dt{ display: block; width: 100%;}
.act dt img{ width: 100%;}
.act dd{ display: block;padding-top: 30px; padding-left: 20px;}
    .act h3{ font-size: 40px; line-height: 1.7em;}
.act .phone{  font-size: 28px;}
.act p.moreBtn{ margin-top: 0 !important;}
    
}









.mapBox { text-align: center;}
.mapBox img{ width: 90%; max-width: 700px;}

.mapBox{padding:100px 0; text-align: center;background:url(/common2020/images/access/sec03_image02.jpg) no-repeat center top; background-size: cover;}
.mapBox img{}


@media(max-width:750px){

}

#company{margin:0 auto 50px; padding-bottom:50px; }
#company >.inner{width: 700px; margin:0 auto 50px; }
.dlListPack dl{ display: table; margin-bottom: 0.8em; width: 100%; border-top: 1px dashed #ccc;padding-top: 1em;padding-bottom:1em;}
.dlListPack dt{ display: table-cell; width: 20%; text-align: center; vertical-align: top;}
.dlListPack dt >.inner{ display: inline-block; border-radius:6px; background: #1482a0; color: #fff; line-height: 1em; padding:4px 10px; font-size: 90%; width: 100%}
.dlListPack dd{ display: table-cell; padding: 0 1em;}
.dlListPack dd >.inner{ font-size: 90%;padding-top: 4px;}

#company h3{font-family: 'Sawarabi Mincho', sans-serif; padding-bottom: 10px; text-align: center;
font-size: 160%; margin-bottom: 30px; line-height: 1.2em;}

@media(max-width:750px){

.dlListPack dt{ display: table-cell; width:23%}

}









#contactTel .text01{ font-size: 16px;margin-bottom: 20px;}
#contactTel .text02{ font-size: 40px; margin-bottom: 20px; text-align: center; font-weight: bold;
    line-height: 1em;}
#contactTel .text03{ font-size: 16px; margin-bottom: 20px; text-align: center;}
#contactTel .text04{ font-size: 16px; margin-bottom: 40px;}

#contactTel .text02 a{ color: #333;}

@media(max-width:750px){
    #contactTel .text02{ font-size: 50px; }
#contactTel .text03{ font-size: 26px; }
}




#entryList{ width: 700px; margin:0 auto;}
#entryList article{padding: 30px ; width: auto; background: url(../images/common/dotline.png) repeat-x left top; background-size:13px auto; }

#entryList article h2{ font-size: 20px; margin-bottom:10px;}
#entryList article .date{ font-size: 14px; margin-bottom: 6px;}
#entryList article p{ line-height: 1.6em; margin-bottom:0.8em;}
#entryList article img{ width: 100%;}
#entryList .moreBtn{ padding-bottom: 0 !important; margin-top: 30px;}

.more-link{ display:none !important;}

@media(max-width:750px){


#entryList article h2{ font-size: 36px; margin-bottom:15px;}
#entryList article .date{ font-size: 30px; margin-bottom: 10px;}
#entryList article p{ font-size:28px; line-height: 1.6em; margin-bottom:0.8em;}
#entryList  p.moreBtn{padding:0;}

}




#entryList_qa{ width: 700px; margin: 0 auto;}

#entryList_qa article{padding: 30px 0; width: auto; background: url(../images/common/dotline.png) repeat-x left top; background-size:13px auto;}
#entryList_qa article dl{}
#entryList_qa article dt{ margin-bottom:1em; font-size: 20px;}
#entryList_qa article dd{ position: relative; left: 36px;}
#entryList_qa article span.qa_q{ font-size: 120%;  font-weight: bold; }
#entryList_qa article span.qa_a{ font-size: 120%;  font-weight: bold; }

@media(max-width:750px){

#entryList_qa{ width: 650px; margin: 0 auto;}
#entryList_qa article dd{ position: relative; left: 0; margin-left: 0;}
}








.gallerySections{ width: 1000px; margin: 0 auto 50px;}

.gallerySections:before,
.gallerySections:after {content: " ";display:table;}
.gallerySections:after {clear: both;}
.gallerySections{*zoom: 1;}

 #instagram{width: 600px;  padding-top: 100px; margin: 0 auto;}
 #gallery{width: 800px;  padding-top: 0; margin: 0 auto;}

@media(max-width:750px){

.gallerySections{ width: 650px; margin: 0 auto 50px;}
 #instagram{width: 650px;  padding-top: 100px; margin: 0 auto;}
 #gallery{width: 650px;  padding-top: 0; margin: 0 auto;}

}

@media(min-width:751px){
#gallery ul{ margin-bottom: 9px;}
#gallery ul li{width: 263px; margin-right: 5px; margin-bottom: 4px; float:left;}
#gallery ul li:nth-child(3n){ margin-right: 0;}
#gallery ul li a{}
#gallery ul:before,
#gallery ul:after {content: " ";display:table;}
#gallery ul:after {clear: both;}
#gallery ul{*zoom: 1;}
}


@media(max-width:750px){

.gallerySections{ width: auto; margin: 0 20px 50px;}
.gallerySections #instagram{width: auto; float: none; padding-top: 100px;}
.gallerySections #gallery{width: auto; float: none; padding-top: 100px;}
    
 #gallery ul{
display: grid;
grid-template-columns: repeat(2, 1fr);
column-gap: 10px;
row-gap: 10px;
    }
    


}




.campaign{ width: auto; margin: 0 auto; padding-top:30px;}
.campaign h2{ margin-bottom: 20px;}
.campaign h3{font-size: 24px; margin-bottom: 20px;padding: 0.5em 0; border: 1px solid #999; border-width: 1px 0; text-align: center;}
.campaign h4{font-size: 18px; margin-bottom: 10px;padding-left:10px;}
.campaign p{font-size: 14px; margin-bottom: 40px; padding-left:20px;}


@media(max-width:750px){
	


.campaign{padding-top:0;}
.campaign h2{ margin-bottom: 20px;}
.campaign h3{font-size: 32px; margin-bottom: 30px;}
.campaign h4{font-size: 24px; margin-bottom: 20px;padding-left:10px;}
.campaign p{font-size: 19px; margin-bottom: 50px; padding-left:20px;}
}




