#key { background: url(../img/dinner/key.png) no-repeat left 4% bottom; background-size: cover; } h2 { margin-bottom: 15px; } /*============================================= ******************* sec1 ********************** *=============================================*/ #sec1 { padding: 10vw 0 7vw; } #sec1 .txt span{ font-size: 17px; } /*============================================= ******************* sec2 ********************** *=============================================*/ #sec2 .bg { background: url(../img/dinner/sec2_bg.png) no-repeat center top; padding: 8vw 3% 5vw; background-size: 108% 100%; } #sec2 .sec2-js { margin: 5vw 0; } #sec2 .sec2-js .slick-dots { margin-top: 0; } /*============================================= ******************* sec4 ********************** *=============================================*/ #sec4, #sec4-2 { padding: 10vw 0 20vw 20%; position: relative; } #sec4:before, #sec4-2:before { content: ''; position: absolute; top: 22vw; left: -18%; width: 50%; height: 44vw; background: url(../img/dinner/sec4_deco.png) no-repeat center top; background-size: contain; } #sec4 h2, #sec4-2 h2 { width: 86%; } #sec4 .price, #sec4-2 .price { color: #646d3f; font-weight: 600; font-size: 4.5vw; margin-bottom: 2vw; } #sec4 .red, #sec4-2 .red { color: #d40000; } /*============================================= ******************* sec3 ********************** *=============================================*/ #sec3, #sec3-2 { padding-bottom: 4vw; position: relative; background: url(../img/shared/bg_1.jpg) repeat center top; } #sec3:before, #sec3-2:before { content: ''; position: absolute; top: 1px; left: 0; width: 100%; height: 15vw; transform: translateY(-100%); background: url(../img/dinner/sec3_bg.png) no-repeat center top; background-size: 100%; } #sec3 h2, #sec3-2 h2 { text-align: center; background: #f2eeeb; padding: 4vw 0px; margin: 0 auto; border-radius: 15px; } #sec3 h2 img, #sec3-2 h2 img { width: 70%; margin: 0 auto; } #sec3 .box-rss .title, #sec3-2 .box-rss .title { margin: 6vw 0; padding-bottom: 0; } #sec3 .box-rss .title a, #sec3-2 .box-rss .title a { background: url(../img/dinner/sec3_txt_bg.png) no-repeat center center; background-size: 104% 18vw; padding: 2vw 2%; letter-spacing: -1px; display: flex; justify-content: space-between; } #sec3 .box-rss .photo span, #sec3-2 .box-rss .photo span { width: 100% !important; height: 82vw !important; } #sec3 .box ul, #sec3-2 .box ul { margin-bottom: 5vw; border: 2px solid #595959; position: relative; padding: 12vw 0px 3vw 5%; } #sec3 .box ul li:nth-child(1), #sec3-2 .box ul li:nth-child(1) { line-height: 30px; color: #fff; background: #383838; width: 100%; height: 30px; text-align: center; position: absolute; top: 0; left: 0; } /*============================================= ******************* sec8 ********************** *=============================================*/ #sec8 { padding: 10vw 0 5vw; } #sec8 .photo { width: 70%; margin: 2vw auto 6vw; } #sec8 .box { padding: 5vw 4% 1vw; background: rgba(255, 255, 255, 0.6); } #sec8 .box h3 { width: 70%; margin: 0 auto; } #sec8 .box .price { text-align: center; color: #667040; margin-top: -6vw; font-weight: bold; font-size: 4vw; } #sec8 .border { border: 1px solid rgba(0, 0, 0, 0.2); margin-top: 8vw; padding: 0vw 3%; } #sec8 .border h3 { text-align: center; transform: translateY(-4vw); } #sec8 .border h3 span { background: url(../img/shared/body_bg.jpg) repeat center top; padding: 0 10px; font-size: 4vw; } /*============================================= ******************* sec6 ********************** *=============================================*/ #sec6 { padding: 0vw 0 5vw; background: url(../img/shared/bg_1.jpg) repeat center top; position: relative; margin-top: 20vw; } #sec6:before { content: ''; position: absolute; top: 1px; left: 0; width: 100%; height: 16vw; transform: translateY(-100%); background: url(../img/dinner/sec6_bg.png) no-repeat center top; background-size: 100%; } #sec6 h2 { margin: 0 -3% 6vw; } #sec6 .row2 { margin-top: 8vw; } #sec6 .row2 .photo2 { margin: 14vw -3%; position: relative; } #sec6 .row2 .photo2:before { content: ''; position: absolute; top: -17vw; left: -3%; width: 30%; height: 20vw; background: url(../img/dinner/sec6_d1.png) no-repeat center top; background-size: contain; } #sec6 .row2 .photo2:after { content: ''; position: absolute; bottom: -12vw; right: -3%; width: 33%; height: 20vw; background: url(../img/dinner/sec6_d2.png) no-repeat center top; background-size: contain; } /*============================================= ******************* sec7 ********************** *=============================================*/ #sec7 { padding-top: 8vw; } #sec7 .note { margin-top: -20px; margin-bottom: 4vw; text-align: center; } #sec7 .listmenu { margin-bottom: 10vw; } #sec7 .listmenu .menu-ttl { font-size: 16px; color: #fff; background: #595959; font-weight: 500; text-align: center; width: 100%; margin: 3vw 0 1vw; padding: 2.5vw 0; } #sec7 .listmenu dl { display: flex; width: 100%; border-bottom: 1px solid rgba(0, 0, 0, 0.1); line-height: 22px; padding: 11px 0 10px; justify-content: space-between; } #sec7 .listmenu dl dd { text-align: right; min-width: 19%; } /*# sourceMappingURL=dinner.css.map */ .btn_menu { width: 90%; margin: 20px auto; } .btn_menu a { display: block; background: #656e41; padding-bottom: 7px; color: #fff; font-size: 13px; text-align: center; letter-spacing: 0.2em; line-height: 20px; } .btn_menu a:hover { text-decoration: none; opacity: .8; }