@charset "UTF-8";

*{ box-sizing: border-box;}
html{ font-size: 62.5%; font-family: 'Noto Sans JP', sans-serif;}
body{ font-size: 1.6rem; margin: 0 auto; color: black;}
.body_container{ background-color: #EFEDE0; margin: 0 auto; position: relative;}
header{ text-align: center; margin: 0 auto; width: 1000px;} 
footer{ position: relative; z-index: 2;}
.amu_top_btn>a{ display: flex; margin: 0 auto; background-color: #c09b30; color: white; justify-content: center; align-items: center;}
.jq_footer{ text-align: center;}
.jq_footer>a{ display: block;}

footer{ background: #EFEDE0;}
@media (min-width: 768px) {
.pcnone{ display: none !important;}

footer{ padding: 50px 0; margin: 0 auto;}
.amu_top_btn>a{ width: 300px; height: 60px;}
.jq_footer>a{ width: 100px; margin: 50px auto 0;}
}
@media (max-width: 767px) {
.spnone{ display: none !important;}
header {width: 100%;}

footer{padding-top: 30px;}
.amu_top_btn>a{ width: 180px; height: 30px; font-size: 10px;}
.jq_footer>a{ width: 100px; margin: 30px auto 0;}
}

main{ position: relative; z-index: 2; margin: 0 auto; width: 1000px; font-family: serif;}

@media (min-width: 768px) {
main{ width: 1000px; }
main>p:last-child{ font-size: 14px;}
}
@media (max-width: 767px) {
main{ width: 100vw; padding: 0 10px;}
main>p:last-child{ font-size: 13px; margin: -20px 20px 20px;}
}

.topimg{position: relative;}
@media (min-width: 768px) {
.topimg .link01 a {position: absolute; width: 122px; height: 13%; top: 20%; left: 21%; z-index: 10;}
.topimg .link02 a {position: absolute; width: 122px; height: 13%; top: 33%; left: 12%;}
.topimg .link03 a {position: absolute; width: 122px; height: 13%; top: 46%; left: 21%;}
.topimg .link04 a {position: absolute; width: 122px; height: 13%; top: 59%; left: 12%;}
.topimg .link05 a {position: absolute; width: 122px; height: 13%; top: 20%; right: 21%;}
.topimg .link06 a {position: absolute; width: 122px; height: 13%; top: 33%; right: 12%;}
.topimg .link07 a {position: absolute; width: 122px; height: 13%; top: 46%; right: 21%;}
.topimg .link08 a {position: absolute; width: 122px; height: 13%; top: 59%; right: 12%;}
}
@media (max-width: 767px) {
.topimg .link01 a {position: absolute; width: 16%; height: 13%; top: 17%; left: 12%; z-index: 10;}
.topimg .link02 a {position: absolute; width: 17%; height: 13%; top: 31%; left: 0;}
.topimg .link03 a {position: absolute; width: 16%; height: 13%; top: 45%; left: 12%;}
.topimg .link04 a {position: absolute; width: 17%; height: 13%; top: 61%; left: 0;}
.topimg .link05 a {position: absolute; width: 17%; height: 13%; top: 17%; right: 12%;}
.topimg .link06 a {position: absolute; width: 16%; height: 13%; top: 31%; right: 0;}
.topimg .link07 a {position: absolute; width: 16%; height: 13%; top: 45%; right: 12%;}
.topimg .link08 a {position: absolute; width: 17%; height: 13%; top: 61%; right: 0;}
}




/*.link01:hover a {background-color: rgba(213,234,216,0.5); border-radius: 50%; position: absolute; width: 109px; height: 108px; top: 19%; left: 22%; z-index: 0;}*/


.shop_box .shop_img{ position: relative;}
.shop_box .shop_img .icon{position: absolute;}
.contents{color: #746C4D; margin-top: 10px;}
.contents .name{ border-bottom: 1px solid #746C4D;}
.bunner{filter: drop-shadow(5px 5px 5px gray);}



@media (min-width: 768px) {
.bunner{margin: 10px auto; width: 70%;}
.headline{margin: 80px auto 20px; width: 80%;}
.container{display: flex; justify-content: center; flex-wrap: wrap;}	
.shop_box{ width: calc(25% - 50px); margin: 25px;}
.shop_box .shop_img .icon{width: 65px; top: -22px; right: -20px;}
.contents .name{padding: .5rem 0; font-size: 16px;}
.contents .lead{font-size: 13px; margin-top: 5px;}
.contents .place{font-size: 10px;}
}

@media (max-width: 767px) {
.bunner{margin: 10px;}
.headline{margin-top: 20px;}
.container{margin: 0 20px;}
.shop_box{ position: relative; margin-top: 15px; margin-bottom: 50px;}
.shop_box .shop_img{width: 80%; margin: 0 auto;}
.shop_box .shop_img .icon{width: 70px; top: -22px; right: -20px;}
.contents .lead{font-size: 15px; margin-top: 5px;}
.contents .place{font-size: 12px;}
}

.top_btn { position: fixed; bottom: 50px; right: 10%; background-color: #525252; width: 50px;  border-radius: 25px; text-align: center; z-index: 10;}
.top_btn a { display: inline-block; color: #FFFFFF; padding: 10px; font-size: 20px; }



/*tokutenn*/
.tokutencontents{position: relative; padding-top: 50px;}
@media (min-width: 768px) {
.tokutenlink a {position: absolute; width: 100%; height: 7%; top: 48%; right:0;}
}
@media (max-width: 767px) {
.tokutenlink a {position: absolute; width: 100%; height: 6%; top: 51%; right:0;}
}











@media (min-width: 768px) {

}
@media (max-width: 767px) {

}