@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Zen+Old+Mincho:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400..900&display=swap');

/*----------------------------------------------------
	☆PC
----------------------------------------------------*/
.bgWhite {
    background: #fff;
}

.bgw01 {
    padding: 8px 0 50px 0;
}

#wrapper {
    margin-bottom: 0;
}

.pc-none {
    display: none;
}

.sp-none {
    display: block;
}

.nowrap{
    white-space: nowrap;
    display: inline-block;
}

#oimo2026 a:hover{
    text-decoration: none;
}

#oimo2026 ul, #oimo2026 p, #oimo2026 dl{ margin-bottom: 0;}
#oimo2026 dd{ margin-left: 0;}

#oimo2026 {
	width: 100%;
    overflow: hidden;
	position: relative;
	color: #fff;
	font-family: "Shippori Mincho B1", serif;
    letter-spacing: 0.15em;
	font-size: 15px;
	font-weight: 500;
	font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: antialiased;
	background-image: url("../images/menu/oimo2026/bg_03.jpg");
    background-repeat: repeat;
}

#oimo2026 img { 
    width: 100%; 
    vertical-align: bottom; 
    -webkit-backface-visibility: hidden; 
    backface-visibility: hidden;
}

#oimo2026 .deco {
    position: absolute;
    top: 0;
}

#oimo2026 .zen {
    font-family: "Zen Old Mincho", serif;
  	font-style: normal;
}

#oimo2026 .more {
    max-width: 165px;
    margin: 20px auto -50px;
    position: relative;
    text-align: center;
}

#oimo2026 .more a {
    font-family: "Cinzel", serif;
	font-optical-sizing: auto;
	font-weight: 600;
	font-style: normal;
    display: block;
    background: #a02832;
    color: #fff;
    letter-spacing: .1em;
    border: none;
    padding: 13px 0 9px;
    border-radius: 100px;
    font-size: 17px;
    transition: .3s ease;
}

#oimo2026 .more a:hover {
    text-decoration: none;
    letter-spacing: .3em;
    text-indent: .3em;
	background: #d2323b;
}

#oimo2026 .icon.btn {
    position: absolute;
    left: -60px;
    top: -70px;
    width: clamp(100px, 38%, 190px);
    z-index: 5;
}

#oimo2026 .icon.btn a {
    display: block;
    transition: all .4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    -webkit-transition: all .4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}


/*--- mv ---*/
#oimo2026 #mv {
    position: relative;
}

#oimo2026 #mv .mvInner {
    position: relative;
    max-width: 1440px;
    margin: 0 auto;
	width: 100%;
	overflow: hidden;
}

#oimo2026 #mv .mvInner .mvTitle {
    width: min(50%, 720px);
    left: 7%;
    top: 5%;
}

#oimo2026 #mv .mvInner .mvText {
	width: min(3.2%, 46px);
    left: 85%;
    top: 4%;
}

#oimo2026 #mv .mvInner .mvDate {
    width: min(13.6%, 195px);
    left: 4.5%;
    top: 32%;
    z-index: 1;
}


/*--- intro ---*/
#oimo2026 #intro {
    position: relative;
	padding: 90px 0;
    background: url(../images/menu/oimo2026/bg_02.jpg) top center / cover no-repeat;
}

#oimo2026 #intro .introInner {
    width: 85%;
    max-width: 870px;
    margin: 0 auto;
}

#oimo2026 #intro .about .aboutInner {
    display: flex;
    justify-content: center;
    align-items: center;
	gap: 3%;
}

#oimo2026 #intro .about .imgBox {
    width: 61%;
}

#oimo2026 #intro .about .txtBox {
    width: 100%;
}

#oimo2026 #intro .about .txtBox .title {
    font-size: 30px;
    text-align: left;
    line-height: 1.6;
	font-weight: 700;
    margin-bottom: 20px;
}

#oimo2026 #intro .about .txt {
    text-align: justify;
	margin-bottom: 20px;
	line-height: 1.9;
    letter-spacing: 0.08em;
}
	
#oimo2026 #intro .about .note {
    text-align: left;
    font-size: 12px;
    letter-spacing: 0.01em;
}

/*--- menu ---*/
#oimo2026 #menu {
    position: relative;
    padding: 90px 0 160px;
}

#oimo2026 #menu .caution {
    position: relative;
	color: #7e4336;
    text-align: center;
    font-size: 13px;
    line-height: 1.5;
    display: block;
    z-index: 1;
    font-weight: 700;
    width: 85%;
    margin: 0 auto 60px;
}

#oimo2026 #menu .menuArea {
    position: relative;
    margin: 280px auto 0;
}

#oimo2026 #menu .menuArea .menuBox {
    position: relative;
}

#oimo2026 #menu .menuArea .menuBox:not(:last-child) {
    margin-bottom: 300px;
}

#oimo2026 #menu .menuBox .menuPatt {
    position: absolute;
}

#oimo2026 #menu .menuBox:nth-child(odd) .menuPatt.deco01 {
    width: 120px;
    left: 0;
    top: -23.5%;
}

#oimo2026 #menu .menuBox:nth-child(even) .menuPatt.deco01 {
    width: 120px;
	height: 120px;
    left: 0;
    top: -23.5%;
	background: #ffdc82;
}

#oimo2026 #menu .menuBox:nth-child(odd) .menuPatt.deco02 {
    width: 120px;
	height: 120px;
    right: 0;
    bottom: -8%;
	background: #ffdc82;
}

#oimo2026 #menu .menuBox:nth-child(even) .menuPatt.deco02 {
    width: 120px;
    right: 0;
    bottom: -8%;
}

#oimo2026 #menu .menuPatt.deco03 {
    width: 380px;
	height: 380px;
    left: 0;
    top: -10%;
    opacity: 0.25;
	background-image: url("../images/menu/oimo2026/bg_pattern_02.png");
    background-repeat: repeat;
}

#oimo2026 #menu .menuPatt.deco04 {
    width: 380px;
	height: 380px;
    right: 0;
    bottom: 5%;
    opacity: 0.25;
	background-image: url("../images/menu/oimo2026/bg_pattern_02.png");
    background-repeat: repeat;
}

#oimo2026 #menu .menuArea .menuBox .boxInner {
    position: relative;
	margin: 0 auto;
	max-width: 1000px;
	width: 85%;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox {
    position: relative;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox .menuBg {
    position: relative;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox .mainImg {
    position: absolute;
	width: min(86%, 860px);
    left: 50%;
    transform: translateX(-50%);
	bottom: 0;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox .mini {
    position: absolute;
	width: min(12.2%, 122px);
    right: -6%;
	bottom: -12%;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox .en {
    position: absolute;
	max-width: none;
    width: 117%;
    left: 50%;
    transform: translateX(-50%);
	top: -30%;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox .copy {
    position: absolute;
    top: -30%;
    right: 10%;
    writing-mode: vertical-rl;
    color: #fff;
}
#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox .copy span {
    display: inline-block;
    font-size: clamp(14px, 1.5vw, 18px);
    font-weight: 700;
    background: #a02832;
    padding: 12px 3px;
    margin-left: 5px;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .txtBox {
    background: #fff;
    padding: 7px;
    position: relative;
    width: 70%;
    max-width: 600px;
    margin: 0 auto;
	margin-top: -75px;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .txtBox .txtInner {
    border: 1px solid #7e4336;
    padding: 25px;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .txtBox .txtInner:before {
    content: "";
    position: absolute;
    top: 7px;
    left: 7px;
    right: 7px;
    bottom: 7px;
    background-image: url(../images/menu/oimo2026/frame_pattern_01.svg), url(../images/menu/oimo2026/frame_pattern_02.svg), url(../images/menu/oimo2026/frame_pattern_03.svg), url(../images/menu/oimo2026/frame_pattern_04.svg);
    background-size: 10px, 10px, 10px, 10px;
    background-position: left top, right top, left bottom, right bottom;
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .txtBox .txtInner .menuTitle {
    color: #7e4336;
	font-size: 24px;
	margin-bottom: 10px;
	text-align: center;
	font-weight: 700;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .txtBox .txtInner .price {
    color: #7e4336;
	font-size: 18px;
	text-align: center;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .txtBox .txtInner .price  span {
	font-size: 80%;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .txtBox .txtInner .txtDeco {
    position: absolute;
	width: 70px;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .txtBox .txtInner .txtDeco.deco01 {
    left: -1%;
	bottom: 1%;
}

#oimo2026 #menu .menuArea .menuBox .boxInner .txtBox .txtInner .txtDeco.deco02 {
    right: -1%;
	top: 1%;
}


/*--- sns ---*/
#oimo2026 #sns {
   background: url(../images/menu/oimo2026/bg_01.jpg) top center / cover no-repeat;
    position: relative;
    padding: 90px 0;
}

#oimo2026 #sns .snsList {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 85%;
    max-width: 320px;
    margin: 0 auto;
    position: relative;
}

#oimo2026 #sns .snsList li a {
    display: block;
    width: 45px;
    height: 45px;
    transition: .3s ease;
}

#oimo2026 #sns .snsList li a:hover {
    transform: scale(1.15);
    filter: drop-shadow(0 0 4px rgba(255, 255, 255, .4));
}


/*--- report ---*/
@keyframes slide {
    from { background-position: 0 0; }
    to { background-position: 2700px 0; }
}

#oimo2026 .report {
    width: 100%;
    margin: 0 auto;
    height: 360px;
    background: url(../images/menu/oimo2026/sanchi-bk.jpg) 0 0 / 2700px 360px repeat-x;
    position: relative;
    animation: slide 80s linear infinite;
}

#oimo2026 .report:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    opacity: 1;
    position: absolute;
    top: 0;
    left: 0;
    transition: all 450ms cubic-bezier(0.37, 0.86, 0.82, 0.94);
}

#oimo2026 .report.slide:after {
    opacity: .35;
    transition: all 1200ms cubic-bezier(0.37, 0.86, 0.82, 0.94);
}

#oimo2026 .report .reportInner {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80%;
    height: 100%;
    margin: 0 auto;
    position: relative;
    z-index: 10;
}

#oimo2026 .report .reportInner .reportTxt {
}

#oimo2026 .report .reportInner .reportTxt .title {
    font-size: 36px;
    line-height: 1.36;
    font-weight: 500;
    letter-spacing: .15em;
    color: #fff;
    text-align: center;
    margin: 0 auto 20px;
    text-shadow: 0 0 10px #542418, 0 0 30px #542418, 0 0 60px #542418;
}

#oimo2026 .report .reportInner .reportTxt .title span {
    display: inline-block;
    font-size: 65%;
}

#oimo2026 .report .more {
    max-width: 164px;
	margin: -23px auto 0;
    position: relative;
	text-align: center;
}

#oimo2026 .report .more {
    margin: 30px auto 0;
}

#oimo2026 .report .more a {
	display: block;
    background: #fff;
    font-family: "canto-pen", serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
    color: #74003d;
    letter-spacing: .1em;
    border: none;
    padding: 13px 0 9px;
    border-radius: 100px;
    font-size: 17px;
    transition: .3s ease;
}

#oimo2026 .report .more a:hover {
    text-decoration: none;
    letter-spacing: .1em; /* ← 元と同じにして動かないように */
    text-indent: 0;       /* ← 動かさない */
    filter: none;          /* ← 影を消してフラットに */
    background: #f9e8f0;   /* ← 代わりに背景色を変えてもOK */
}





/*-------------------------------------------
Animation
-------------------------------------------*/

#mv .slidein,
.out.slidein,
.out .slidein{
    opacity: 0;
}

#mv .slidein,
.in.slidein,
.in .slidein{
    animation: slidein 0.8s ease forwards;
}

@keyframes slidein{
    0%{ transform: translate(0,10px); opacity: 0; }
    100%{  transform: translate(0,0);opacity: 1;}
}

/*右→左移動*/
#oimo2026 #mv .mvInner .pattern.deco01 {
	animation: slideinToL 1.5s ease-out forwards;
}
@keyframes slideinToL {
	0% { transform: translate(30%,0); opacity: 0;}
	100% { transform: translate(0,0); opacity: 1;}
}

/*左→右移動*/
#oimo2026 #mv .mvInner .pattern.deco02 {
	animation: slideinToR 1.5s ease-out forwards;
}
@keyframes slideinToR {
	0% { transform: translate(-30%,0); opacity: 0;}
	100% { transform: translate(0,0); opacity: 1;}
}

#oimo2026 .clip01 {
    clip-path: inset(0 0 100% 0);
}

#oimo2026 .in .clip01,
#oimo2026 .in.clip01,
#oimo2026 #mv .clip01{
    animation: clip01 0.6s ease forwards;
}

#oimo2026 .clip02 {
    clip-path: inset(0 100% 0 0);
}

#oimo2026 #mv .clip02{
    animation: clip02 0.6s ease forwards;
}

#oimo2026 .in .clip02,
#oimo2026 .in.clip02 {
    animation: clip02 2.6s ease forwards;
}

@keyframes clip01 {
	0% { clip-path: inset(0 0 100% 0); }
	100% { clip-path: inset(0 0 0 0); }
}
@keyframes clip02 {
	0% { clip-path: inset(0 100% 0 0); }
	100% { clip-path: inset(0 0 0 0); }
}


#oimo2026 #mv .mvTitle .animeInner,
#oimo2026 #mv .mvText .animeInner {
    opacity: 0;
}

#oimo2026 #mv .blur {
    animation: blurAnime 1.2s ease forwards;
}

@keyframes blurAnime{
    from {
    filter: blur(15px);
    transform: scale(1.03);
    opacity: 0;
    }

    to {
    filter: blur(0);
    transform: scale(1);
    opacity: 1;
    }
}



.pon {
    opacity: 0;
}

.in .pon,
.in.pon {
    animation: pon 0.8s cubic-bezier(0.680, -0.550, 0.265, 1.550) 0.6s both;
}

@keyframes pon {
  0% { transform: scale(0.5); opacity: 0;}
  100% { transform: scale(1); opacity: 1;}
}



/*--- delay ---*/
.delay01{ animation-delay: 0.1s!important;}
.delay02{ animation-delay: 0.2s!important;}
.delay03{ animation-delay: 0.3s!important;}
.delay04{ animation-delay: 0.4s!important;}
.delay05{ animation-delay: 0.5s!important;}
.delay06{ animation-delay: 0.6s!important;}
.delay07{ animation-delay: 0.7s!important;}
.delay08{ animation-delay: 0.8s!important;}
.delay09{ animation-delay: 0.9s!important;}
.delay10{ animation-delay: 1.0s!important;}
.delay11{ animation-delay: 1.1s!important;}
.delay12{ animation-delay: 1.2s!important;}
.delay13{ animation-delay: 1.3s!important;}
.delay14{ animation-delay: 1.4s!important;}
.delay15{ animation-delay: 1.5s!important;}
.delay16{ animation-delay: 1.6s!important;}
.delay17{ animation-delay: 1.7s!important;}
.delay18{ animation-delay: 1.8s!important;}
.delay19{ animation-delay: 1.9s!important;}
.delay20{ animation-delay: 2.0s!important;}
.delay21{ animation-delay: 2.1s!important;}
.delay22{ animation-delay: 2.2s!important;}
.delay23{ animation-delay: 2.3s!important;}
.delay24{ animation-delay: 2.4s!important;}
.delay25{ animation-delay: 2.5s!important;}
.delay26{ animation-delay: 2.6s!important;}
.delay27{ animation-delay: 2.7s!important;}
.delay28{ animation-delay: 2.8s!important;}
.delay29{ animation-delay: 2.9s!important;}
.delay30{ animation-delay: 3.0s!important;}
.delay31{ animation-delay: 3.1s!important;}
.delay32{ animation-delay: 3.2s!important;}
.delay33{ animation-delay: 3.3s!important;}
.delay34{ animation-delay: 3.4s!important;}
.delay35{ animation-delay: 3.5s!important;}
.delay36{ animation-delay: 3.6s!important;}
.delay37{ animation-delay: 3.7s!important;}
.delay38{ animation-delay: 3.8s!important;}
.delay39{ animation-delay: 3.9s!important;}
.delay40{ animation-delay: 4.0s!important;}






/*----------------------------------------------------
	☆HOVER
----------------------------------------------------*/


/*----------------------------------------------------
	☆ 600以上
----------------------------------------------------*/
@media only screen and (min-width: 600px) {
    #oimo2026 .icon.btn a:hover {
        transform: scale(1.15);
        -ms-transform: scale(1.15);
        -webkit-transform: scale(1.15);
    }
}


/*----------------------------------------------------
	☆TABLET UNDER 900
----------------------------------------------------*/

@media screen and (max-width:900px) {
	#oimo2026 #intro .about .txtBox .title {
		font-size: 24px;
	}
	
	#oimo2026 #menu .menuArea {
		margin: 220px auto 0;
	}
	
	#oimo2026 #menu .menuBox:nth-child(odd) .menuPatt.deco01 {
		width: 100px;
		top: -15%;
	}
	
	#oimo2026 #menu .menuBox:nth-child(odd) .menuPatt.deco02 {
		width: 100px;
		height: 100px;
		bottom: -13%;
	}
	
	#oimo2026 #menu .menuBox:nth-child(even) .menuPatt.deco01 {
		width: 100px;
		height: 100px;
		top: -12.5%;
	}
	
	#oimo2026 #menu .menuBox:nth-child(even) .menuPatt.deco02 {
		width: 100px;
		right: 0;
		bottom: -10%;
	}
	
	#oimo2026 #menu .menuPatt.deco03 {
		width: 300px;
		height: 300px;
		top: 0;
		background-size: 3%;
	}
	
	
	#oimo2026 #menu .menuPatt.deco04 {
		width: 300px;
		height: 300px;
		bottom: 0;
		background-size: 3%;
	}
	
	#oimo2026 #menu .menuArea .menuBox:not(:last-child) {
		margin-bottom: 250px;
	}
	
	#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox .mini {
		position: absolute;
		width: 11%;
		right: 70%;
		bottom: 19%;
	}
	
	#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox .copy {
		top: -35%;
        right: 3%;
	}
	
}

/*----------------------------------------------------
	☆TABLET UNDER 700
----------------------------------------------------*/

@media screen and (max-width:700px) {
	#oimo2026 #menu .menuArea {
        margin: 160px auto 0;
    }
	
	#oimo2026 #menu .menuArea .menuBox:not(:last-child) {
        margin-bottom: 200px;
    }
	
	#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox .copy {
        right: 0;
	}
	
}


/*----------------------------------------------------
	☆UNDER 600
----------------------------------------------------*/

@media screen and (max-width:600px) {
	
	.pc-none {
		display: block;
	}

	.sp-none {
		display: none;
	}

	#oimo2026 {
		font-size: 14px;
	}
	
	#oimo2026 .more {
		margin: 15px auto -50px;
		max-width: 140px;
	}
	
	#oimo2026 .more a {
		padding: 11px 0 7px;
		font-size: 15px;
	}
	
	#oimo2026 .icon.btn {
        top: -115px;
        width: clamp(120px, 45%, 170px);
        left: -20px;
    }
	
	
	/*--- mv ---*/
	#oimo2026 #mv .mvInner .mvTitle {
		width: 94%;
        left: 50%;
        transform: translateX(-50%);
        top: 7.5%;
	}
	
	#oimo2026 #mv .mvInner .mvText {
		width: 8.5%;
		left: 86%;
		top: 35%;
	}
	
	#oimo2026 #mv .mvInner .mvDate {
		width: 36%;
        left: 4.5%;
        top: 40%;
	}
	
	
	/*--- intro ---*/
	#oimo2026 #intro {
		padding: 60px 0;
	}
	
	#oimo2026 #intro .about .aboutInner {
		display: block;
	}
	
	#oimo2026 #intro .about .imgBox {
		width: 54%;
		margin: -40px auto 5px;
	}
	
	#oimo2026 #intro .about .txtBox .title {
        text-align: center;
    }
	
	#oimo2026 #intro .about .txt {
		margin-bottom: 15px;
	}
	
	#oimo2026 #intro .about .note {
		text-align: justify;
		font-size: 11px;
	}
	
	
	
	/*--- menu ---*/
	#oimo2026 #menu {
		padding: 60px 0 150px;
	}
	
	#oimo2026 #menu .caution {
		font-size: 12px;
	}
	
	#oimo2026 #menu .menuArea {
        margin: 160px auto 0;
    }
	
	#oimo2026 #menu .menuArea .menuBox:not(:last-child) {
		margin-bottom: 60vw;
	}
	
	#oimo2026 #menu .menuArea .menuBox .boxInner {
		width: 100%;
	}
	
	#oimo2026 #menu .menuBox:nth-child(odd) .menuPatt.deco01 {
		width: 70px;
		top: -35%;
	}
	
	#oimo2026 #menu .menuBox:nth-child(odd) .menuPatt.deco02 {
		width: 70px;
		height: 70px;
		bottom: -10%;
	}
	
	#oimo2026 #menu .menuBox:nth-child(even) .menuPatt.deco01 {
		width: 70px;
		height: 70px;
		top: -35%;
	}
	
	#oimo2026 #menu .menuBox:nth-child(even) .menuPatt.deco02 {
		width: 70px;
		bottom: -10%;
	}
	
	#oimo2026 #menu .menuPatt.deco03 {
		width: 200px;
		height: 200px;
		top: -25%;
		background-size: 4%;
	}
	
	#oimo2026 #menu .menuPatt.deco04 {
		width: 200px;
		height: 200px;
		bottom: 0;
		background-size: 4%;
	}
	
	#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox .en {
		width: 100%;
		top: -45%;
	}
	
	#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox .mainImg {
		width: 125%;
	}
	
	#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox .mini {
        width: 16%;
        right: 76.5%;
        bottom: 12%;
    }
	
	#oimo2026 #menu .menuArea .menuBox .boxInner .imgBox .copy {
        right: 4%;
        top: -60%;
    }
	
	#oimo2026 #menu .menuArea .menuBox .boxInner .txtBox {
		width: 85%;
		margin-top: -40px;
	}
	 
	#oimo2026 #menu .menuArea .menuBox .boxInner .txtBox .txtInner {
		padding: 25px 20px;
	}
	
	#oimo2026 #menu .menuArea .menuBox .boxInner .txtBox .txtInner .menuTitle {
		font-size: 22px;
		margin-bottom: 5px;
	}
	
	
	/*--- SNS ---*/
	
	#oimo2026 #sns .snsList {
		width: 75%;
	}
	
	#oimo2026 #sns {
    	padding: 60px 0;
	}
}