@charset "UTF-8";
/* CSS Document */


/* --------------------------------------------------------------------------------
	Reset
-------------------------------------------------------------------------------- */

html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
b,u,i,center,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,embed,
figure,figcaption,footer,header,hgroup,
menu,nav,output,ruby,section,summary,
time,mark,audio,video{
	margin:0;
	padding:0;
	font-family: "Kaisei Opti", serif;
	letter-spacing: 0.1em;
	font-weight: normal;
	
}

html{
  scroll-behavior: smooth;
}



*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}


input,
textarea{
	font-weight:normal;
	font-size:100%;
}
ul{
	list-style:none;
}
blockquote,q{
	quotes:none;
}
blockquote:before,blockquote:after,
q:before,q:after{
	content:'';
	content:none;
}
input,
textarea,
select{
	 
}
a{
	overflow:hidden;
	outline:none;
	text-decoration:none;
	color: #000;
	
}
a:hover,
a:active{
	opacity:0.8;
}
input[type="text"]:focus{
	outline:0;
}
table{
	border-collapse:collapse;
	border-spacing:0;
}

img{
	max-width: 100%;
	border:none;
	-ms-interpolation-mode:bicubic;
	vertical-align:bottom;
	height: auto;
}

a img{
	border:none;
}
a:hover img{
	opacity:0.7;
	filter:alpha(opacity=70);		/* ie7 */
	-ms-filter:"alpha(opacity=70)";	/* ie8 */
}





/* --------------------------------------------------------------------------------
	タグ
-------------------------------------------------------------------------------- */

html,body {
    height: 100%;
	margin:0;
	font-feature-settings: "palt";
	
	
}


body{
	line-height:1.5;
	font-size:80%;
	-webkit-text-size-adjust:100%;
}



/* --------------------------------------------------------------------------------
	共通クラス
-------------------------------------------------------------------------------- */

.device-pc{
	display:none!important;
}

.device-sp{
	display:block;
}


.inner{
	padding: 0 18px;
}



.more-btn{
	text-align: center;
}

.more-btn a{
	display: inline-block;
	min-width: 200px;
	text-align: center;
	background: #DEAC5B;
	color: #fff;
	font-size: 15px;
	padding: 10px 30px;
	border-radius: 20px;
	transition: background 0.3s ease, color 0.3s ease;
}


.more-btn a:hover{
	background: #000;
	
}


/*
	header
*/


#header {
	background: #fff;
    position:fixed;
    width: 100%;
	top:0;
	z-index: 9000;
	height: 70px;
	padding: 10px 15px;
}

/* ハンバーガーメニューアイコン */
#menu {
    cursor: pointer;
	position: absolute;
	top:20px;
	right: 10px;
    z-index: 9999;
}

#menu img{
    width: 80px;
}



/* ナビゲーションメニューの初期状態（非表示） */
#nav-menu {
	width: 100%;
    height: 100vh; /* 必ずビュー全体の高さに設定 */
    display: none; /* 初期は非表示 */
    position: fixed; /* fixedに変更してスクロールを制御 */
    top: 0;
    right: 0;
    background: #FF9401;
    color: #fff;
    padding: 130px 5vw 60px;
    opacity: 0; /* 初期透明 */
    transform: translateY(-20px); /* 少し上にずらす */
    transition: opacity 0.5s ease, transform 0.5s ease;
    overflow-y: auto; /* 縦スクロールを有効化 */
    overscroll-behavior: contain; /* スクロール跳ね返り防止 */
    -webkit-overflow-scrolling: touch; /* モバイル用スムーズスクロール */
    z-index: 9998; 
	
}


#nav-menu .menu-inner{
    
	margin: 0 auto;
}



#nav-menu .menu-inner ul.up {
    display: flex;
	justify-content: center;
	align-items: flex-end;
	flex-wrap: wrap;
	
}


#nav-menu .menu-inner ul.up li{
	width: 48%;
	margin: 0 0 40px;
	text-align: center;

}

#nav-menu .menu-inner ul.btm {
    display: flex;
	justify-content: space-around;
	align-items: flex-end;
	flex-wrap: wrap;
	margin: 0 0 80px;
}


#nav-menu .menu-inner ul.btm li{
	width: 48%;
	text-align: center;
	margin: 0 0 40px;
	
}



#nav-menu ul.footer_menu {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 0 0 30px;
}

#nav-menu ul.footer_menu li {
	padding: 0 15px;
	margin: 0 0 10px;
	width: 50%;
}


#nav-menu ul.footer_menu a {
        font-size: 14px;
        color: #fff;
        text-decoration: none;
    }

#nav-menu ul.footer_menu2 {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 0 0 40px;
}

#nav-menu ul.footer_menu2 li {
	padding: 0 15px;
	margin: 0 0 10px;
	width: 50%;
}


#nav-menu ul.footer_menu2 a {
        font-size: 14px;
        color: #fff;
        text-decoration: none;
    }










#nav-menu .menu-inner ul li span{
	font-size: 16px;
	color: #fff;
	display: block;
	margin: 5px 0 0;

}



#nav-menu .menu-footer{
	display: flex;
	justify-content: space-between;
	align-items: center;
	
	margin: 0 auto;
}



#nav-menu .menu-footer-l ul{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: center;
	margin: 0 0 30px;
}

#nav-menu .menu-footer-l ul li{
	width: 49%;
	margin: 0 0 10px;
}


#nav-menu .menu-footer-l ul.sns{
	display: flex;
	justify-content: center;
	align-items: center
}

#nav-menu .menu-footer-l ul.sns li{
	margin: 0 20px;
	width: auto;
}

#nav-menu .menu-footer-r{
	display: none;
}



#nav-menu .menu-footer-r .logo img{
	width: 160px;
}


#nav-menu .menu-footer-r .logo p{
	font-size: 19px;
}

#nav-menu .menu-footer-r .logo p a{
	font-size: 30px;
	color: #fff;
}



/* メニュー表示状態 */
#nav-menu.show {
    display: block; /* 表示する */
    opacity: 1; /* 不透明にする */
    transform: translateY(0); /* 元の位置に戻す */
}


/*
	mv
*/



#mv{
	position: relative;
	
}

#mv .mv-img img{
	height: 100vh;
}

#mv .mv-img img{
	width: 100%;
	height: 100vh;
	object-fit: cover;
}

#mv .mv-img video{
	height: 100vh;
}

#mv .mv-img video{
	width: 100%;
	height: 100vh;
	object-fit: cover;
}



#mv h2{
	position: absolute;
	bottom:58vw;
	left: 20px;
}


#heading{
	position: relative;
	margin: 0 0 calc(1380px - 44vw);
}


#heading .bg-img{
	position: absolute;
	top:-72vw;
	width: 100%;
	min-height: 1330px;
	background: url("../images/common/bg-sp.png") no-repeat top;
	background-size: cover;
	
	
}




#heading .msc{
	text-align: right;
	margin: 0 0 100px;
}






#heading #memory_travel .txt{
	width: 100%;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	
}

#heading #memory_travel .txt p{
	margin: 0 0 17px;
	text-align: center;
	
}



#heading #memory_travel .txt p {
    position: relative;
   
}

#heading #memory_travel .txt p img {
    width: 100%; /* 汽車画像の幅を調整 */
    animation: gatangoton 2.5s infinite ease-in-out; /* アニメーション適用 */
}

@keyframes gatangoton {
   0% { transform: translateY(0) rotate(0); } /* 中心位置 */
    25% { transform: translateY(-10px) rotate(-5deg); } /* 上に揺れる */
    50% { transform: translateY(10px) rotate(5deg); }  /* 下に揺れる */
    75% { transform: translateY(-10px) rotate(-5deg); } /* 上に戻る */
    100% { transform: translateY(0) rotate(0); }  
}





#heading #memory_travel ul li{
	width: 230px;
	margin: 0px;
}

#heading #memory_travel ul li img{
	width: 230px;
	height: 150px;
	object-fit: cover;
}




#heading .about-ekiben{
	text-align: center;
	margin: 40px 0 0;
}



#heading #news{
	width: 94%;
	margin: 60px auto;
	background: #fff;
	padding: 45px 20px;
}



#heading #news h2{
	font-size: 26px;
	color: #FF6201;
	text-align: center;
	margin: 0 0 25px;

}


#news .content {
    display: none;
}
#news .content.show {
    display: block;
}


#heading #news .tab-container{
	display: flex;
	justify-content: center;
	margin: 0 0 35px;

}

#heading #news .tab-container .tab{
	font-size: 16px;
	margin: 0 10px;
	

}


#heading #news .tab-container .tab.active{
	border-bottom: 2px solid #000;
	font-weight: bold;
}

#heading #news .content-container{
	/*margin: 0 0 40px;*/
}


#heading #news .content-container ul{
	display: flex;
	overflow-x: scroll;
	padding: 0 0 15px;
	margin: 0 0 25px;

}

/*#heading #news .content-container ul::before{
	content: '';
	position: fixed;
	left: 0;
	top:40%;
	width: 22px;
	height: 41px;
	background-image: url("../images/common/i-pre.svg");
	
}


#heading #news .content-container ul::after{
	content: '';
	position: fixed;
	right: 0;
	top:40%;
	width: 22px;
	height: 41px;
	background-image: url("../images/common/i-next.svg");
	
}

*/





#heading #news .content-container ul li{
	flex-shrink: 0;
	width: 230px;
	margin: 0 30px 0 0;

}



#heading #news .content-container ul li .tag{
	font-size: 12px;
	border: 1px solid #000;
	border-radius: 13px;
	display: inline-flex;
	padding: 1px 15px;
	margin: 0 0 10px;
	font-weight: bold;

}

#heading #news .content-container ul li .thum{
	margin: 0 0 15px;
}

#heading #news .content-container ul li .thum img{
	width: 230px;
	height: 150px;
	border-radius: 13px;

}


#heading #news .content-container ul li .date{
	font-size: 12px;
	margin: 0 0 5px;
	color: #DEAC5B;
}


#heading #news .content-container ul li p{
	font-size: 15px;
	font-weight: bold;
}


#heading #news p.scroll{
	font-size: 14px;
	text-align: right;
	margin: 0 0 15px;
	
}



/*レポート*/


#report{
	width: 100%;
	margin: 0 auto;
	padding: 70px 20px;

}



#report h2{
	font-size: 26px;
	color: #FF6201;
	text-align: center;
	margin: 0 0 60px;

}



#report ul{
	display: flex;
	overflow-x: scroll;
	padding: 0 0 15px;
	margin: 0 0 25px;

}

#report ul li{
	flex-shrink: 0;
	width: 230px;
	margin: 0 30px;

}



#report ul li .thum{
	margin: 0 0 15px;
}

#report ul li .thum img{
	width: 230px;
	height: 150px;
	border-radius: 13px;

}


#report ul li .date{
	font-size: 12px;
	color: #DEAC5B
}


#report ul li p{
	font-size: 17px;
	font-weight: bold;
	margin: 0 0 15px;
}

#report p.scroll{
	font-size: 14px;
	text-align: right;
	margin: 0 0 15px;
	
}

/*あら竹のこと*/

#koto {
	background:#FFD5ED;
}




#koto .koto-img{
	position: relative;
}

#koto .koto-img .img img{
	width: 100%;
	height: 350px;
	object-fit: cover;
}

#koto .koto-img h2{
	position: absolute;
	width: 230px;
	margin: 0 auto;
	bottom: -30px;
	left: 0;
	right: 0;
}



#koto .inner {
	padding: 70px 0 60px;
}

#koto .inner h3{
	font-size: 26px;
	font-weight: bold;
	color: #FF4500;
	text-align: center;
	margin: 0 0 40px;
}


#koto .inner p{
	font-size: 14px;
	color: #FF4500;
	line-height: 2;
	text-align: center;
}


/*駅弁*/


#ekiben{
	background: #FDECCD;
}


#ekiben .ekiben-img{
	position: relative;
	width: 100%;
}


#ekiben .ekiben-img .img img{
	width: 100%;
	object-fit: cover;
}



#ekiben .yuge01 {
    position: absolute;
    top: -100px;
    left: 0%; 
    width: 200px;
    background: radial-gradient(closest-side, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));
    border-radius: 50%;
    transform: translateX(-50%);
    animation: rise01 4s infinite ease-in-out, fade01 4s infinite ease-in-out, wobble 5s infinite ease-in-out;
    opacity: 0;
}

/* 湯気のエフェクト02 */
#ekiben .yuge02 {
    position: absolute;
    top: -140px;
    left: 70%; 
    width: 200px;
    background: radial-gradient(closest-side, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));
    border-radius: 50%;
    transform: translateX(-50%);
    animation: rise02 5s infinite ease-in-out, fade02 6s infinite ease-in-out, wobble 4.5s infinite ease-in-out;
    opacity: 0;
}

/* 湯気のエフェクト03 */
#ekiben .yuge03 {
    display: none;
}

/* 湯気がゆっくり上昇する動き */
@keyframes rise01 {
    0% {
        transform: translateX(-50%) translateY(20px);
    }
    100% {
        transform: translateX(-50%) translateY(-200px);
    }
}

@keyframes rise02 {
    0% {
        transform: translateX(-50%) translateY(30px);
    }
    100% {
        transform: translateX(-50%) translateY(-250px);
    }
}

@keyframes rise03 {
    0% {
        transform: translateX(-50%) translateY(10px);
    }
    100% {
        transform: translateX(-50%) translateY(-180px);
    }
}

/* 湯気の透明度が変化する */
@keyframes fade01 {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        opacity: 0;
    }
}

@keyframes fade02 {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 0.6;
    }
    100% {
        opacity: 0;
    }
}

@keyframes fade03 {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 0.4;
    }
    100% {
        opacity: 0;
    }
}

/* 湯気の横揺れを再現 */
@keyframes wobble {
    0% {
        transform: translateX(-50%);
    }
    25% {
        transform: translateX(-48%);
    }
    50% {
        transform: translateX(-50%);
    }
    75% {
        transform: translateX(-52%);
    }
    100% {
        transform: translateX(-50%);
    }
}



#ekiben .inner{
	padding: 50px 18px 70px;
	width: 100%;
	margin: 0 auto;
}


#ekiben .inner h2{
	font-size: 30px;
	color: #FF6201;
	text-align: center;
	margin: 0 0 60px;
	font-weight: bold;
}


#ekiben .inner ul{
	display: flex;
	flex-flow: wrap;
	justify-content: space-between;
	
}

#ekiben .inner ul li{
	width: 48%;
	margin: 0 0 40px;
	
}

#ekiben .inner ul li .thum {
	text-align: center;
	
}

#ekiben .inner ul li .thum img{
	width: 140px;
	height: 140px;
	object-fit: contain;
	
}


#ekiben .inner ul li:nth-child(1){
	width: 100%;
	
	margin: 0 0 20px;
}

#ekiben .inner ul li:nth-child(1) img{
	width: 100%;
	height: 100%;
	object-fit: contain
	
}


#ekiben .inner ul li:nth-child(2){
	width: 100%;
	margin: 0 0 40px;
}

#ekiben .inner ul li:nth-child(2) img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	
}



#ekiben .inner ul li h3{
	font-size: 16px;
	color: #FF6201;
	font-weight: bold;
	margin: 15px 0 5px;
	
}


#ekiben .inner ul li p{
	font-size: 20px;
	margin: 0 0 5px;
	font-weight: bold;
	
}



#ekiben .inner ul li .txt{
	display: flex;
	justify-content: space-around;
	align-items: baseline;
	
	
}


#ekiben .inner ul li .txt h3{	
	font-size: 22px;
	color: #FF6201;
	font-weight: bold;
	margin: 0;
	
}

#ekiben .inner ul li .txt .price{	
	font-size: 16px;
	margin: 0 0 15px;
	font-weight: bold;
	
}


#ekiben .inner .pdf-btn{	
	text-align: center;
	margin: 50px 0 0;
	
}



#pickup{
	background: #FDECCD;
	padding: 0 20px 90px;
}

#pickup h2{
	font-size: 30px;
	color: #FF6201;
	text-align: center;
	margin: 0 0 30px;
	font-weight: bold;
}

#pickup .lead{
	text-align: center;
	
}


#pickup ul{
	display: flex;
	flex-direction: column;
	align-items: center;
	
}

#pickup ul li{
	width: 100%;
	text-align: center;
	margin: 0 0 30px;
	display: flex;
	justify-content: center;
}









/*
	鉄道掛け紙シリーズ
*/

#kakegami{
	position: relative;
	display: flex;
	justify-content: center;
}

#kakegami .img img{
	height: 300px;
	width: 100%;
	object-fit: cover;
}

#kakegami .txt{
	position: absolute;
	top:30px;
	text-align: center;
	display: flex;
	width: 100%;
	height: calc(100% - 30px);
	flex-direction: column;
}

#kakegami .txt h2{
	font-size: 20px;
	font-weight: bold;
	color: #EF4218;
	margin: 0 0 20px;
}

#kakegami .txt p{
	text-align: center;
	font-size: 17px;
	background: #EF4218;
	color: #fff;
	margin-top: auto;
	width: 100%;
	padding: 12px 0;
	
}



#kakegami .kakegami-btn{
	position: absolute;
	bottom:65px;
	text-align: center;
	left: 20px;
}

#kakegami .kakegami-btn a{
	width: 80px;
	height: 80px;
	border-radius: 50%;
	color: #EF4218;
	background: #fff;
	border: 4px solid #EF4218;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 12px;
	line-height: 1.2;
}

#kakegami .kakegami-btn a:hover{
	background: #000;
	transition: background 0.3s ease, color 0.3s ease;
}



/*
	ご利用案内
*/


#guide{
	background: #EDEDED;
	padding: 70px 0 0;
}

#guide .inner{
	width: 100%;
	margin: 0 auto;
}

#guide h2{
	text-align: center;
	margin: 0 0 40px;
}

#guide h2 img{
	width: 160px;
}

#guide ul{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	flex-direction: column;
}

#guide ul li{
	margin: 0 20px 40px;
}


#guide ul li .img{
	position: relative;
	margin: 0 0 15px;
	text-align: center;
	height: 208px;
}




#guide ul li .img .txt{
	position: absolute;
	z-index: 99;
	width: 100%;
	
}

#guide ul li .img .bg{
	position: absolute;
	z-index: 90;
	width: 100%;
}


/* 基本スタイル */
#guide ul li .img .bg img {
  transition: box-shadow 0.3s ease, transform 0.3s ease; /* アニメーションのスムーズな動き */
}

/* マウスオーバー時 */
#guide ul li .img:hover .bg img {
  transform: scale(1.2); /* 少し拡大 (オプション) */
}






#guide ul li h3{
	font-size: 19px;
	color: #FE5FDA;
	border-bottom: 1px solid #FE5FDA;
	padding: 0 0 10px;
	margin: 0 0 15px;
	text-align: center;
}

#guide ul li p{
	font-size: 16px;

}



/*
	もっと知りたいあら竹
*/


#more-aratake{
	background: #EDEDED;
	padding: 70px 0;
}

#more-aratake .inner{
	width: 100%;
	margin: 0 auto;
}

#more-aratake h2{
	text-align: center;
	margin: 0 0 40px;
}

#more-aratake h2 img{
	width: 320px;
}


#more-aratake ul{
	margin: 0 0 40px;
}


#more-aratake ul li{
	width: 100%;
	margin: 0 0 40px;
	display: flex;
	flex-direction: column;
	align-items: center;
}


/*#more-aratake ul li a{
	display: flex;
	justify-content: space-between;
}

#more-aratake ul li:nth-child(odd) a{
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
}

*/

#more-aratake ul li .img{
	width: 60%;
	text-align: center;
	margin: 0 0 20px;
}


/* 基本スタイル */
#more-aratake ul li .img img {
  transition: box-shadow 0.3s ease, transform 0.3s ease; /* アニメーションのスムーズな動き */
}

/* マウスオーバー時 */
#more-aratake ul li .img:hover img {
  transform: scale(1.05); /* 少し拡大 (オプション) */
}





#more-aratake ul li .txt{
	width: 100%;
	
}



#more-aratake ul li h3{
	font-size: 19px;
	color: #27B29C;
	border-bottom: 1px solid #27B29C;
	padding: 0 0 10px;
	margin: 0 0 15px;
	text-align: center;
	
}

#more-aratake ul li p{
	font-size: 14px;

}


#more-aratake ol {
	list-style: none;

}

#more-aratake ol li{
	text-indent: -1em;
	padding: 0 0 0 1em;
	margin: 0 0 10px;
	width: 100%;
	align-items: flex-start;
	

}

#more-aratake ol li p{
	font-size: 14px;

}






/*
	sns
*/


#sns{
	background: #969EF2;
	padding: 60px 0 50px;
}


#sns .inner{
	width: 100%;
	margin: 0 auto;
	
}

#sns h2{
	text-align: center;
	margin: 0 0 40px;
}


#sns h2 img{
	width: 80px;
}



#sns .movie{
	text-align: center;
	margin: 0 0 40px;
}


#sns iframe{
	width: 100%;
	height: 200px;
	margin: 0 0 10px;
}

#sns .movie p{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}

#sns .movie p::before{
	content: '';
	display: inline-block;
	width: 22px;
	height: 17px;
	background-image: url("../images/common/i-youtube-b.svg");
	background-size: contain;
	margin: 0 10px 0 0;
	
}



#sns ul{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 0 0 30px;
}
#sns ul li{
	width: 30%;
	margin: 0 0 15px;
}




#sns .note{
	display: flex;
	justify-content: center;
}






/*
	shop_info
*/


#shop_info {
	background-color: #fff;
	padding: 80px 17px;
}

#shop_info h2 {
	text-align: center;
	margin: 0 0 40px;
}

#shop_info h2 img{
	width: 160px;
}


#shop_info .shop_detail {
	max-width: 375px;
	margin: 0 auto;
}

#shop_info .shop_detail p {
	font-family: "Hiragino Sans", "Hirafgino Kaku Gothic ProN", Meiryo, "sans-serif";
	padding-left: 25px;
}



#shop_info ul {
	display: flex;
	justify-content: center;
	width: 100%;
	flex-direction: column;
}

#shop_info ul li {
	width: 100%;
	padding-right: 0;
	margin-bottom: 47px;
}

#shop_info ul li img {
	display: block;
	margin: 0 auto;
}


#shop_info ul li:last-child img {
	padding-top: 0;
}

#shop_info ul li:last-child p {
	padding-left: 5px;
}

#shop_info ul li h4 {
	font-size: 18px;
	font-weight: bold;
	margin: 22px 0;
	text-align: center;
}

#shop_info ul li .address {
	margin-bottom: 20px;
}

#shop_info ul li .opening_ours {
	margin-bottom: 20px;
}


/*
	shinsui
*/

#shinsui {
	background-color: #E6DFD2;
	padding: 50px 0;
}

#shinsui p,
#shinsui dl {
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
}


#shinsui h3 {
	font-size: 25px;
	font-weight: bold;
	color: #705143;
	width: 100%;
	text-align: center;
	margin-bottom: 15px;
}

#shinsui .brother {
	padding: 0 17px;
	width: 100%;
	margin-bottom: 60px;
}

#shinsui .brother img {
	
	margin: 0 auto;
}


#shinsui .about {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	align-items: flex-end;
	width: 100%;
	flex-direction: column-reverse;
}

#shinsui .about_desc {
	width: 100%;
}

#shinsui .think {
	font-size: 18px;
	padding: 0;
	display: block;
	text-align: center;
	margin-bottom: 25px;
}

#shinsui .sub-ttl {
	font-size: 15px;
	padding: 0;
	display: block;
	text-align: center;
	margin-bottom: 0;
	margin-top: 26px;
}


#shinsui .ttl {
	font-size: 20px;
	font-weight: normal;
	padding: 5px 0 20px 0;
	text-align: center;
}

#shinsui .device-sp {
	width: 100%;
	text-align: center;
}

#shinsui .device-sp img {
	margin: 0 auto;
}

#shinsui .about dl {
	display: flex;
	font-size: 14px;
	flex-wrap: wrap;
	row-gap: 5px;
	padding: 0 17px;
	max-width: 375px;
	margin: 0 auto;
}
#shinsui .about dt {
	width: 30%;
}
#shinsui .about dd {
	width: 70%;
}

#shinsui .about_img {
	width: 100%;
}

#shinsui .img-box {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	width: 100%;
	justify-content: space-between;
	padding: 0 17px;
	max-width: 375px;
	margin: 0 auto;
}

#shinsui .img-box img {
	width: 48%;
	padding-right: 0;
	padding-bottom: 17px;
}

#shinsui .img-box p.deco {
	display: none;
	top: -100px;
	right: 50%;
	transform: translateX(-50%);
	writing-mode: horizontal-tb;
	font-size: 18px;
}

#shinsui .img-box img.deco {
	display: none;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 70px;
	height: 70px;
}

#shinsui .img-box img:nth-child(3),
#shinsui .img-box img:nth-child(4){
	padding-bottom: 0;
}

#shinsui .guide {
	width: 148px;
	background-color: #705143;
	text-align: center;
	padding: 10px 0;
	position: relative;
	margin: 45px auto 0 auto;
}

#shinsui .guide a {
	color: #fff;	
	padding-right: 20px;
	text-decoration: none;
}



#shinsui .guide::before,
#shinsui .guide::after {
	position: absolute;
	top:　0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}

#shinsui .guide::before {
	display: none;
	top: 22px;
	right: -100px;
	width: 10px;
	height: 2px;
	background-color: #fff;
}

#shinsui .guide::after {
	top: 15px;
	right: -100px;
	width: 10px;
	height: 10px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
}

#shinsui .guide:hover::before,
#shinsui .guide:hover::after {
		-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}


#shinsui .guide:hover::after {
/*	right: -150px;*/
}



#furusato {
	text-align: center;
	margin: 0 auto;
	padding: 100px 20px;
}
#furusato h2 {
	font-size: 25px;
	margin-bottom: 1rem;
}
#furusato p {
	font-size: 16px;
	margin: 0 0 20px;
}
#furusato ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	
}
#furusato ul li {
	width: 48%;
	margin: 0 0 15px;
	
}








/*
	footer
*/

#footer {
	position: relative;
	background-image: url("https://www.ekiben-aratake.com/item/motarou/images/footer_img.jpg");
	background-position: center top;
	background-size: contain;
	background-repeat: no-repeat;
	overflow: hidden;
	height: 670px;
}
@media screen and (min-width:739px) {
	#footer {
	background-size: cover;
	}	
}


#footer .footer_menu {
	display: flex;
	width: 80%;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 320px;
	flex-wrap: wrap;
	justify-content: center;
		z-index: 2;
}

#footer .footer_menu li {
	width: 33%;
	text-align: center;
	margin-bottom: 13px;
}


#footer .footer_menu a {
	display: block;
	font-size: 14px;
	color: #fff;
	text-decoration: none;
}


#footer .footer_menu2 {
	display: flex;
	width: 80%;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 180px;
	flex-wrap: wrap;
	justify-content: center;
		z-index: 2;
}

#footer .footer_menu2 li {
	width: 45%;
	text-align: center;
	margin-bottom: 13px;
}


#footer .footer_menu2 a {
	display: block;
	font-size: 14px;
	color: #fff;
	text-decoration: none;
}



#footer .train {
	position: absolute;
	width: 100%;
	height: 70px;
	bottom: 90px;
	left: 0;
	right: 0;
	z-index: 2;
}

#footer .train img {
	object-fit: cover;
	object-position: right;
	width: 100%;
	height: 100%;
}

#footer .liquid {
	position: absolute;
    width: 100%;
    height: 420px;
    bottom: 70px;
	left: 0;
    background-image: url("https://www.ekiben-aratake.com/item/motarou/images/footer-liquid_sp.png");
	background-repeat: no-repeat;
	background-size: cover;
}


#footer .copy-right {
	font-size: 14px;
	position: absolute;
	bottom: 15px;
	left: 50%;
	transform: translateX(-50%);
	color: #fff;
}


#footer img {
	width: 100%;
}

#fix-bnr{
	width: 100%;
	position: fixed;
	bottom: 0;
	background: #FF6201;
	padding:15px 10px;
}

#fix-bnr ul{
	display: flex;
	justify-content: space-between;
}

#fix-bnr ul li{
	margin: 0 7px;
}

/*add*/


#memory_travel ul li{
	width: 138px;
	margin: 5px;
}

#memory_travel ul li img{
	width: 138px;
	height: 96px;
	object-fit: cover;
}


#gallery {
	margin: 0 0 60px;
}

#gallery #memory_travel ul li{
	width: 196px;
	margin: 0px;
}


#gallery #memory_travel ul li img{
	width: 196px;
	height: 131px;
	margin: 0px;
}


#voice {
	
	background-color: #FE9D00;
	padding: 60px 0 ;
	margin: 0 0 90px;
    }




#voice .voice-ttl{
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 40px 20px;
	
    }


#voice .voice-ttl .img{
	padding: 40px 40px 0;
	text-align: center;
	
    }


#media .video iframe{
	width: 100%;
	height: 190px;
	object-fit: contain;
}


#media .media_inner .video p {
    width:100%;
	text-align: center;
	padding: 10px 0 0;
        
    }



/* アニメーションの定義 */
@keyframes slideLeft {
  0% {
    transform: translateX(100%); /* 右側から開始 */
  }
  100% {
    transform: translateX(-100vw); /* 左端まで移動 */
  }
}

/* .ico のアニメーション設定 */
.ico {
width: 220px;
  position: absolute; /* アニメーションに影響されるため position を指定 */
  bottom: 92px; /* フッターの高さに合わせて調整 */
  right: 0;
  animation: slideLeft 30s linear infinite; /* 10秒間でループ */
  will-change: transform; /* アニメーションをスムーズにする */
}





/* --------------------------------------------------------------------------------
	買える場所
-------------------------------------------------------------------------------- */


#store .inner{
	
}


#store .mv-img img{
	width: 100%;
	height: 430px;
	object-fit: cover;
}



#store #aratake-no-koto{
	position: relative;
}


#store #aratake-no-koto h2{
	position: absolute;
	width: 230px;
	top:-20px;
	left: 0;
	right: 0;
	margin: 0 auto;
}



#store #aratake-no-koto .inner{
	padding: 60px 0 70px;
	position: relative;
	text-align: center;
}




#store #aratake-no-koto h3{
	font-size: 26px;
	margin: 0 0 40px;
	
}


#store #aratake-no-koto h3 span{
	font-size: 20px;
	display: block;
	
}


#store #aratake-no-koto p{
	font-size: 16px;
	line-height: 2;
	
}


#store #aratake-no-koto .img01{
	position: absolute;
	right: 0px;
    top: 160px;
	
}


#store #aratake-no-koto .img01 img{
	width: 100px;
	
}



#store #aratake-no-koto .img02{
	position: absolute;
	left: 0px;
	top: 160px;
	
}

#store #aratake-no-koto .img02 img{
	width: 80px;
	
}



#store #aratake-no-koto .img03{
	position: absolute;
	right: 0px;
    bottom: 0px;
	
}

#store #aratake-no-koto .img03 img{
	width: 120px;
	
}

/*
	店舗情報
*/

#store #shop_info {
	background: #EDEDED;
	padding: 80px 18px 40px;
	
    }

#store #shop_info h2 img {
        width: 120px;
    }




/*
	駅弁一覧
*/

#store #ekiben-list{
	position: relative;
	display: flex;
	justify-content: center
	
}

#store #ekiben-list .img img{
	height: 300px;
	width: 100%;
	object-fit: cover;
}

#store #ekiben-list .txt{
	position: absolute;
	top: 30px;
	text-align: center;
	display: flex;
	width: 100%;
	height: calc(100% - 30px);
	flex-direction: column;
}

#store #ekiben-list .txt h2{
	font-size: 20px;
	font-weight: bold;
	color: #FF6201;
	margin: 0 0 20px
}

#store #ekiben-list .txt p{
	text-align: center;
	font-size: 17px;
	background: #FF6201;
	color: #fff;
	margin-top: auto;
	width: 100%;
	padding: 12px 0;
	
}



#store #ekiben-list .ekiben-btn{
	position: absolute;
	bottom: 65px;
	text-align: center;
	left: 20px;
}

#store #ekiben-list .ekiben-btn a{
	width: 80px;
	height: 80px;
	border-radius: 50%;
	color: #FF6201;
	background: #fff;
	border: 4px solid #FF6201;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 12px;
	line-height: 1.2;
}

#store #ekiben-list .ekiben-btn a:hover{
	color: #fff;
	background: #000;
	transition: background 0.3s ease, color 0.3s ease;
}


/*
	買える場所
*/


#store #place{
	padding: 80px 0;
}



#store #place h2{
	text-align: center;
	margin: 0 0 35px;
}

#store #place h2 img{
	width: 160px;
}



#store #place p.lead{
	text-align: center;
	font-size: 16px;
	margin: 0 0 65px;
}


#store #place ul li{
	margin: 0 0 50px;
}

#store #place ul li .img{
	width: 270px;
	margin: 0 auto 35px;
	text-align: center;
}

#store #place ul li .img .tag{
	display: flex;
	justify-content: center;
	margin: 0 0 20px;
}

#store #place ul li .img .tag span{
	color: #fff;
	font-size: 17px;
	text-align: center;
	background: #4160CB;
	border-radius: 17px;
	padding: 0 10px;
	margin: 0 5px;
}

#store #place ul li .img .tag span.vendor{
	background: #7E4623;
	
}



#store #place ul li .img h3{
	font-size: 30px;
	margin: 0 0 30px;
}




#store #place ul li .txt{
	text-align: center;

}

#store #place ul li .txt .catch{
	font-size: 22px;

}



#store #place ul li .shop-txt h4{
	display: inline-block;
	font-size: 26px;
	border-bottom: 4px solid #FF4500;
	color: #FF4500;
	margin: 0 0 40px;
	text-align: center;
	
}

#store #place ul li .shop-txt h4 span{
	font-size: 12px;
	color: #000;
	margin: 0 0 0 10px;
}



#store #place ul li .shop-txt p{
	font-size: 12px;
	margin: 0 0 40px;
	line-height: 2;
	text-align: left;
}


#store #place ul li .shop-txt p.shop-info{
	font-size: 12px;
	margin: 0 0 40px;
	line-height: 2;
	color: #FF4500;
	text-align: left;
}

#store #place ul li .shop-txt p.shop-info a{
	font-size: 20px;
	color: #FF4500;
	font-weight: bold;
}


#store #place ul li .flow p{
	font-size: 14px;
	margin: 0 0 15px;
	text-align: left;
	
}

#store #place ul li .flow ol li{
	font-size: 14px;
	display: flex;
	justify-content:flex-start;
	align-items: flex-start;
	margin: 0 0 30px;
	text-align: left;
	
	
}

#store #place ul li .flow ol li::before{
	content: '1';
	font-size: 30px;
	display: block;
	width: 66px;
	text-align: center;
	margin: -10px 0 0 ;
	flex-shrink: 0;
}


#store #place ul li .flow ol li:nth-child(1)::before{
	content: '1';
	
	
}

#store #place ul li .flow ol li:nth-child(2)::before{
	content: '2';
	
}


#store #place ul li .flow ol li:nth-child(3)::before{
	content: '3';
	
}


#store #place ul li .flow ol li:nth-child(4)::before{
	content: '4';
	
}

#store #place .flow-img{
	margin: 0 0 50px;
	display: flex;
	justify-content: space-between;
	
}

#store #place .flow-img img{
	width: 33%;
	
}





#store .corpo {
	display: flex;
	justify-content: center;
	background-color: #FFE283;
	margin-bottom: 42px;
}

#store .corpo .corpo_img {
	width: 100px;
	position: relative;
}

#store .corpo .corpo_img img {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	right: 0;
		padding: 10px;
}

#store .corpo .corpo_desc {
	width: 250px;
	margin: 26px 0 36px 0;
}

#store .corpo .corpo_desc h3 {
	font-size: 25px;
	font-weight: bold;
	color: #FF6201;
	margin-bottom: 10px;
}

#store .corpo .corpo_desc p {
	font-size: 15px;
	font-weight: bold;
	margin-bottom: 10px;
}

#store .corpo .corpo_desc .guide {
	width: 157px;
	border-radius: 50px;
	background-color: #FF6201;
	text-align: center;
	padding: 5px 0;
	position: relative;
}

#store .corpo .corpo_desc .guide a {
	color: #fff;	
	padding-right: 0px;
	text-decoration: none;
}



#store .corpo .corpo_desc .guide::before,
#store .corpo .corpo_desc .guide::after {
	display: none;
	position: absolute;
	top:　0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}

#store .corpo .corpo_desc .guide::before {
	top: 22px;
	right: -100px;
	width: 10px;
	height: 2px;
	background-color: #fff;
}

#store .corpo .corpo_desc .guide::after {
	top: 18px;
	right: -100px;
	width: 10px;
	height: 10px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

#store .corpo .corpo_desc .guide:hover::before,
#store .corpo .corpo_desc .guide:hover::after {
		-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}

#store .corpo .corpo_desc .guide:hover::before {
	width: 30px;
	right: -130px;
}
	
#store .corpo .corpo_desc .guide:hover::after {
	right: -150px;
}


/*
よくある質問
*/

#store-faq{
	background: #FDECCD;
	padding: 60px 0;
}

#store-faq h2{
	font-size: 30px;
	color: #FF4500;
	text-align: center;
	margin: 0 0 60px;
}


#store-faq h2 span{
	display: block;
	font-size: 25px;
	color: #FF4500;
	text-align: center;
}


#store .faq-inner {
}

#store .acc_wrap {
	border-bottom: 1px solid #C7C7C7;
	margin-bottom: 10px;
}



#store .acc_cont{
	display: none;
	padding: 0 0 25px;
	font-size: 14px;
	
}

#store .acc_inner{
	display: flex;
	line-height: 1.7;
	
	
}


#store .acc_btn{
	position: relative;
	font-size: 14px;
	font-weight: bold;
	padding: 20px 25px 20px 0 ;
	display: flex;
}


#store .acc_btn span{
	display: inline-flex;
    width: 1.5em;
    height: 1.5em;
    text-align: center;
    justify-content: center;
    align-items: center;
    padding: 10px;
    margin: 0 10px 0 0;
    border-radius: 10px;
}


#store .txt_q{
	padding: 0 10px 0 0;
	
}



#store .acc_btn::before,
#store .acc_btn::after{
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}



#store .acc_btn::before{
	right: 3px;
	width: 10px;
	height: 10px;
	border-top: 1px solid #FF4500;
	border-right: 1px solid #FF4500;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
}

#store .acc_wrap.show .acc_btn::before{
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}


#store .acc_cont span{
	display: inline-flex;
    width: 1.5em;
    height: 1.5em;
    text-align: center;
    justify-content: center;
    align-items: center;
    padding: 10px;
    margin: 0 10px 0 0;
    border-radius: 10px;
}







.fade-in-section {
  opacity: 0; /* 初期状態は非表示 */
  transform: translateY(40px); /* 初期状態で少し下にずらす */
  transition: opacity 0.9s ease, transform 0.9s ease; /* スムーズなアニメーション */
}



/* 表示状態のスタイル */
.fade-in {
  opacity: 1;
  transform: translateY(0);
}






/* --------------------------------------------------------------------------------
	社長経歴 
-------------------------------------------------------------------------------- */

#p-chan *{
	 font-family:"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro","Noto Sans JP","Yu Gothic","Yu Gothic Medium",
    "Meiryo",sans-serif!important;
}



#p-chan .inner{
	padding: 0 18px;
}


#p-chan #p-heading{
	background: url("../images/p-chan/heading-bg.jpg") no-repeat center ;
	background-size: cover;
	padding: 120px 0 40px;
}


#p-chan #p-heading .inner{
	
}


#p-chan #p-heading h2{
	font-size: 25px;
	margin: 0 0 20px;
	font-weight: 700;
}


#p-chan #p-heading h2 span{
	display: inline-block;
	border-bottom: 3px solid #000;
	margin: 0 0 10px;
	font-weight: 700;
}


#p-chan #p-heading .owner-name .position{
	font-size: 15px;
	font-weight: 700;
	margin: 0 0 10px;
}



#p-chan #p-heading .owner-name h3{
	font-size: 30px;
	font-weight: 700;
	margin: 0 0 30px;
}

#p-chan #p-heading .owner-name h3 span{
	font-size: 15px;
	font-weight: 700;
	
}


#p-chan #p-heading p{
	font-size: 14px;
	line-height: 2;
}


#p-chan #p-heading .img{
	position: relative;
	margin: 0 0 40px;
}

#p-chan #p-heading .img .img02{
	position: absolute;
	width: 35vw;
	bottom: -60px;
	right: 0px;
}


#p-chan #p-msg{
	padding: 60px 0;
}

#p-chan #p-msg .inner{
	position: relative;
}



#p-chan #p-msg .txt{
	
}

#p-chan #p-msg .txt h2{
	font-size: 25px;
	font-weight: 700;
	margin: 0 0 30px;
}

#p-chan #p-msg .txt p{
	font-size: 14px;
	line-height: 2;
}

#p-chan #p-msg .img{
	width: 20vw;
	position: absolute;
	top: 0px;
	right: 0px;
}



#p-chan #career{
	background: url("../images/p-chan/career-bg.jpg") no-repeat top ;
	background-size: cover;
	padding: 0 0 60px;
	
}

#p-chan #career h2{
	position: relative;
	margin: 0 0 50px;
}

#p-chan #career h2 img{
	position: absolute;
	width: 40vw;
	right: 0;
	left: 0;
	margin: 0 auto;
	top: -40px;
}

#p-chan #career .mv{
	padding: 60px 0 0;
	text-align: center;
	width: 100%;
	margin: 0 auto 35px;
}

#p-chan #career .prof{
	background: #fff;
	margin: 0 auto;
	padding:50px 20px;
	position: relative;
}


#p-chan #career .prof h3{
	font-size: 23px;
	font-weight: 700;
	margin: 0 0 20px;
}

#p-chan #career .prof p{
	font-size: 14px;
	margin: 0 0 60px;
	line-height: 2;
}

#p-chan #career .prof p.line {
  position: relative;
  padding-left: 28px;
	line-height: 4;
}

/* 縦ライン */
#p-chan #career .prof p.line::before {
  content: "";
  position: absolute;
  left: 6px;
  top: 0.8em;     /* ← 上の●に合わせる */
  bottom: 0.8em;  /* ← 下の●に合わせる */
  width: 2px;
  background: #f39800;
}

/* 上の● */
#p-chan #career .prof p.line::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0.8em;
  width: 14px;
  height: 14px;
  background: #f39800;
  border-radius: 50%;
}

/* 下の●（別疑似要素） */
#p-chan #career .prof p.line span.dot-bottom {
  position: absolute;
  left: 0;
  bottom: 0.8em;
  width: 14px;
  height: 14px;
  background: #f39800;
  border-radius: 50%;
}


#p-chan #career .prof .img02{
	padding-left: 28px;
}


#p-chan #career .prof .img03{
	margin: 0 0 20px;
}

#p-chan #career .prof .img04{
	margin: 0 0 20px;
}


#p-chan #career .prof .img05{
	margin: 0 0 20px;
}



#p-chan #value{
	background: #FF4500;
	
}

#p-chan #value .img img{
	width: 100%;
	
}

#p-chan #value .inner{
	padding: 80px 18px 60px;
	position: relative;
}



#p-chan #value h2{
	font-size: 25px;
	color: #fff;
	margin: 0 0 40px;
	font-weight: 700;
}

#p-chan #value h2 span{
	font-size: 18px;
	color: #fff;
	display: block;
	font-weight: 700;
	
}

#p-chan #value ul{
	color: #fff;
	display: block;
	
}

#p-chan #value ul li{
	font-size: 18px;
	color: #fff;
	display: flex;
	align-items: center;
	margin: 0 0 30px;
	font-weight: 700;
}



#p-chan #value ul li .no{
	font-size: 40px;
	color: #fff;
	font-weight: 700;
	border-bottom: 4px solid #fff;
	margin: 0 20px 0 0;
}



#p-chan #value .icon{
	position: absolute;
	width: 20vw;
	top: -10px;
	right: 20px;
}





#p-chan #heart{
	padding: 80px 0 60px;
}
#p-chan #heart .inner{
	
}


#p-chan #heart h2{
	font-size: 30px;
	text-align: center;
	color: #F5D4C8;
	margin: 0 0 30px;
	
}

#p-chan #heart ul li{
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	
}

#p-chan #heart ul li .img{
	width: 60vw;
	margin: 0 auto;
	
}
#p-chan #heart ul li p{
	font-size: 14px;
	font-weight: 700;
	line-height: 1.8;
	padding: 20px 0 0;
	
}


#p-chan #heart .sns{
	background: #979EF2;
	border-radius: 8px;
	padding: 30px 30px 10px;
	margin: 60px 0 0;
	
}

#p-chan #heart .sns ul{
	
	
}

#p-chan #heart .sns ul li {
	text-align: center;
	margin: 0 0 20px;
	
}