@charset "utf-8";

body {background-color: #FFF;border-top: solid 4px #165d12;}
section p{font-weight: 400;font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;font-feature-settings: "palt";letter-spacing: 0.05em;}

header{width: 100%;margin: 80px 0 50px 0;padding: 0;}
header h1{width: 70vw;max-width: 454px;margin: 0 auto;padding: 0;}
header ul.navi{width: 100%;margin: 50px 0 0 0;padding: 0;display: flex;flex-flow: row wrap;justify-content: center;align-items: center;}
header ul.navi li{font-size: 16px;line-height: 1.4;margin: 0 20px;padding: 0;color: #666;letter-spacing: 0.1em;list-style: none;position: relative;}
header ul.navi li:nth-child(6){background-color: #165d12;color: #FFF;padding: 8px 20px;border-radius: 6px;}
header ul.navi li a{color: #666;text-decoration: none;transition: 0.5s;}
header ul.navi li a:hover{color: #165d12;/*font-weight: bold;*/transition: 0.5s;}
/* 下線のスタイル */
header ul.navi li a::after {background-color: #165d12;bottom: -6px;content: "";height: 2px;left: 0;position: absolute;transform: scale(0, 1);transform-origin: left top;transition: transform .3s;width: 100%;}
/* リンクにホバーした際の下線の表示 */
header ul.navi li a:hover::after {transform: scale(1, 1); /* 下線を横方向に1倍、縦方向に1倍に変形（表示） */}
header ul.navi li:nth-child(6) a{position:absolute;top:0;left:0;width:100%;height:100%;}
header ul.navi li:nth-child(6) a:hover{background-color: #FFF;opacity: 0.2;}
header ul.navi li:nth-child(6) a::after{height: 0;}
header ul.navi li.cel{color: #165d12;}
header ul.navi li.cel::after {position: absolute;background-color: #165d12;bottom: -6px;left: 0;content: "";height: 2px;width: 100%;}

.main_visual{height: 38vw;max-height: 750px;text-align: center;margin: 0;padding: 0;background: url("../images/main.webp") no-repeat center top;background-size: cover;position: relative;}

section.sec01{width: 90%;max-width: 1080px;margin: 80px auto 0 auto;padding: 0;text-align: center;}
section.sec01 p{font-size: 18px;line-height: 2.3;margin: 0 0 25px 0;padding: 0;color: #666666;}
section.sec01 h2{width: 312px;margin: 0 auto 80px auto;padding: 0;}

section.sec02{width: 90%;max-width: 1080px;margin: 80px auto 0 auto;padding: 0;text-align: center;}
section.sec02 h3{font-size: 32px;line-height: 1.6;margin: 0 0 30px 0;padding: 0;color: #555;font-weight: 700;font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;font-feature-settings: "palt";letter-spacing: 0.05em;}
section.sec02 h3 span{font-size: 14px;color: #888;margin-top: 0px;font-weight: 400;display: block;}
section.sec02 p{font-size: 16px;line-height: 1.7;margin: 0;padding: 0;color: #555;}
section.sec02 .detail{width: 100%;margin: 50px 0 0 0;padding: 30px 20px;background-color: #f5f9f8;border: solid 4px #102f27;box-sizing: border-box;}
section.sec02 .detail p{font-size: 16px;line-height: 1.7;margin: 0;padding: 0;color: #555;}
section.sec02 .detail ul{width: 100%;display: flex;flex-flow: row wrap;justify-content: space-between;margin: 0 0 20px 0;padding: 0;}
section.sec02 .detail ul li{list-style: none;}
section.sec02 .detail ul li:nth-child(1){width: 47%;text-align: right;}
section.sec02 .detail ul li:nth-child(2){width: 51%;text-align: left;}
section.sec02 .detail ul li:nth-child(1) p{font-size: 17px;line-height: 1.5;color: #102f27;}
section.sec02 .detail ul li:nth-child(2) p{font-size: 50px;line-height: 1.0;color: #102f27;font-weight: 600;}
section.sec02 .detail ul li:nth-child(2) p span{font-size: 16px;line-height: 1.4;font-weight: 400;}
section.sec02 ul.photo{width: 100%;display: flex;flex-flow: row wrap;justify-content: space-between;padding: 0;margin: 50px 0 0 0;}
section.sec02 ul.photo li{width: 33%;list-style: none;}
section.sec02 p strong{font-size: 20px;font-weight: 600;}	


section.sec03{width: 90%;max-width: 700px;margin: 40px auto 80px auto;padding: 0;text-align: left;}
section.sec03 ul{width: 100%;margin: 0;padding: 0;display: flex;flex-flow: row wrap;justify-content: space-between;gap:30px 0px;}
section.sec03 li{margin: 0;padding: 0;list-style: none;}
section.sec03 li:nth-child(1){width: 42%;}
section.sec03 li:nth-child(2){width: 58%;}
section.sec03 p {font-size: 16px;line-height: 1.7;margin: 0;padding: 0;color: #555;}
section.sec03 p span.tel {font-size: 30px;line-height: 1.4;display: block;font-weight: 600;}
section.sec03 p.hours {position: relative;margin-top: 5px;}
section.sec03 p.hours span {position: absolute;top: 0;left: 70px;}
section.sec03 p.address {margin-top: 0px;}
section.sec03 p.map {margin-top: 5px;}
section.sec03 p.mail {margin-top: 5px;}
section.sec03 p a {opacity: 1.0;transition: all .5s;text-decoration: none;color: #555;}
section.sec03 p a:hover {opacity: 0.5;transition: all .5s;}	
section.sec04{width: 100%;height: 526px;text-align: center;margin: 0;padding: 0;background: url("../images/img_breakfast_footer.webp") no-repeat center top;background-size: cover;position: relative;}
.br_tab{display: none;}


@keyframes fade_title {
	from {opacity: 0;}
	to {opacity: 1;}
}

@media screen and (max-width:1280px){
section.sec06 ul li:nth-child(2) {margin-top: 0px;}
section.sec06 ul li:nth-child(2) p{font-size: 1.4vw;}
section.sec06 ul li:nth-child(2) dl{font-size: 1.4vw;}
section.sec06 ul li:nth-child(2) p span{font-size: 3.2vw;}
}


@media screen and (max-width:980px){
header{width: 100%;margin: 8vw auto 5vw auto;}
header h1 {width: 50vw;}
header ul.navi li{font-size: 1.8vw;margin: 0 2.0vw;}

section.sec01{margin: 10vw auto 0vw auto;}
section.sec01 p{font-size: 2.0vw;}
section.sec01 h2{width: 40vw;margin-bottom: 10vw;}

section.sec02{margin: 10vw auto 0vw auto;}
section.sec02 h3{font-size: 3.6vw;}
section.sec02 h3 span{font-size: 1.8vw;}
section.sec02 p{font-size: 2.0vw;}
section.sec02 .detail p{font-size: 2.0vw;}
section.sec02 .detail ul li:nth-child(1){width: 43%;}
section.sec02 .detail ul li:nth-child(2){width: 54%;}
section.sec02 .detail ul li:nth-child(1) p{font-size: 2.2vw;}
section.sec02 .detail ul li:nth-child(2) p{font-size: 6.6vw;}
section.sec02 .detail ul li:nth-child(2) p span{font-size: 2.0vw;}
section.sec04{height: 38vw;}

.br_tab{display: block;}
}
@media screen and (max-width:768px){
header ul.navi li{font-size: 2.6vw;margin: 3vw 4vw;}
}
/* iphone12 */
@media screen and (max-width:428px){
header {margin-bottom: 8vw;}
header h1{width: 70vw;}
header ul.navi{margin-top: 8vw;}
header ul.navi li{font-size: 3.6vw;margin: 3vw 4vw;}

section.sec01{margin: 8vw auto 0 auto;}
section.sec01 p{font-size: 4vw;text-align: left;}
section.sec01 h2{width: 52vw;margin: 0 auto 8vw auto;}

section.sec01{margin: 8vw auto 0 auto;}
section.sec02 h3{font-size: 8vw;margin: 0 0 5vw 0;}
section.sec02 h3 span{font-size: 4vw;}
section.sec02 p{font-size: 3.6vw;}
section.sec02 .detail{margin: 8vw 0 0 0;padding: 5vw 3vw;}
section.sec02 .detail p{font-size: 3.4vw;}
section.sec02 .detail ul{margin: 0 0 4vw 0;}
section.sec02 .detail ul li:nth-child(1){width: 40%;}
section.sec02 .detail ul li:nth-child(2){width: 56%;}
section.sec02 .detail ul li:nth-child(1) p{font-size: 3.4vw;}
section.sec02 .detail ul li:nth-child(2) p{font-size: 10vw;}
section.sec02 .detail ul li:nth-child(2) p span{font-size: 3.0vw;}
section.sec02 ul.photo{margin: 5vw 0 0 0;}
section.sec02 ul.photo li{width: 100%;}
	
section.sec03{margin: 4vw auto 8vw auto;}
section.sec03 ul{gap:0px;}
section.sec03 li:nth-child(1){width: 100%;}
section.sec03 li:nth-child(2){width: 100%;}
section.sec03 p {font-size: 3.6vw;}
section.sec03 p span.tel {font-size: 10vw;}
section.sec03 p.hours {height: 18vw;}
section.sec03 p.hours span {left: 16vw;}
section.sec03 p a:hover {opacity: 1.0;}	

}
/* iphone12-mini */
@media screen and (max-width:540px){
}

/* iphone8等 */
@media screen and (max-width:375px){
}

/* Android各種 */
@media screen and (max-width:360px){
}