/* reset */
/*body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;}
ul{list-style:none;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;}
q:before,q:after{content:'';}
object,embed{vertical-align:top;}
legend{display:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
img,abbr,acronym,fieldset{border:0;}*/

:root {
--red: #C7161D;
--brown: #572E12;
--brown_20:rgba(87,46,18,0.20);
--beige: #FDEBC7;
	--beige_50:rgba(253,235,199,0.50);
	--beige_20:rgba(253,235,199,0.20);

}

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
	box-sizing: border-box;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

input, select {
    vertical-align:middle;
}



body {
font-family: 'M PLUS 1p', sans-serif;
  font-style: normal;
    -webkit-text-size-adjust: 100%;
    line-height: 1.6;
    font-size: 100%;
    color: #212121;
    background-color: #ffffff;
}


/* 小さい画面用の設定-------------- */
@media (max-width:767px){
body {font-size:82%;}
}
/* -------------end------------- */


ol, ul{
    list-style:none;
}
fieldset, img{
     border:0;
}

caption, th{
    text-align: left;
}
address, caption, cite, code, dfn, em, strong, th, var{
    font-style: normal; 
    font-weight: normal;
}

hr{
	display:none;
}

html {
	margin-bottom:1px;
	height:100%;
}

* {
    box-sizing: border-box;
}

/* line style　------------------------------*/
/* -----------------------------------------*/

a img{
	border-style:none;
}

a:hover {
opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}

/* link style ------------------------------*/
/* -----------------------------------------*/
a:link {
	color: #212121;
	text-decoration: none;	
}
a:visited {  color: #212121;
	text-decoration: none;	}


a:active {
	color: #ccc;
	text-decoration: none; 
}

.link_line{
	text-decoration: underline;
}

img, video, object {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
	border: none;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
}


a:active, a:focus,input:active, input:focus{outline:0;}

img{
	width: 100%;
	height: auto;
}

iframe {
    vertical-align: bottom;
}

/*================================================
 *  ヘッダー
 ================================================*/
.header {
	box-sizing: border-box;
	width: 100%;
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
}


/* 大きい画面用の設定-------------- */
@media (min-width:1001px){
#top .header_outside{
z-index: 10000;
background-color: transparent;
position: absolute;
top:20px;
left: 0;
width: 100%!important;
}
    
#inside .header_outside
{
top: 0;
background-color: #000000;
color: #ffffff;
    
  }
    
#inside .header_list{
   justify-content: center;
}

#inside .header_list{
padding-top: 10px;
padding-bottom: 10px;
}
 
#inside .header_list > li:last-child{
padding-right: 0px;
}
    
.header{
max-width: 1000px;
margin-left: auto;
margin-right: auto;
}
    
.header_list{
display: flex;
justify-content: flex-end;
align-items: center;
padding-top: 5px;
padding-bottom: 5px;
}

    
.drawer_nav > li{
font-size: 88%;
 }
    
.drawer_nav > li:after {
content:"｜";
padding-right: 5px;
padding-left: 5px;
    color: #ffffff;
}

    
.drawer_nav > li:last-child:after {
content:"";
padding-right: 0px;
}


    
.drawer_nav > li a{
color: #ffffff;
/*  text-shadow:1px 1px 0 #5a3d1c, -1px -1px 0 #5a3d1c,
              -1px 1px 0 #5a3d1c, 1px -1px 0 #5a3d1c,
              0px 1px 0 #5a3d1c,  0-1px 0 #5a3d1c,
              -1px 0 0 #5a3d1c, 1px 0 0 #5a3d1c;*/
    
}

}
/* -------------end------------- */


/* 小さい画面用の設定-------------- */
@media (max-width:1000px){
    
.header_outside{
    z-index: 10000;
    background-color: transparent;
    position: absolute;
    top: -111px;
    left: 0;
    width: 100%!important;
}
    
.header {
	padding-top: 10px;
	padding-bottom: 10px;
    padding-left: 10px;}
	
.header_list li:first-child img{
	width: 50%;
}

}
/* -------------end------------- */



/*================================================
 * グロナビ固定
 ================================================*/
@media screen and (min-width:1001px) {
.nav_fixed {
		position:fixed;
		top:0;
		left:0;
z-index: 10000;
}
    
#top .nav_fixed .header_outside,
#inside .nav_fixed .header_outside
{
top: 0;
background-color: #00993E;
color: #ffffff;

}
    
    
.nav_fixed .header_list{
   justify-content: center;
}

    
.nav_fixed .header{
top:0px;
 }
    
.nav_fixed .header_list{
padding-top: 10px;
padding-bottom: 10px;
}
 
.nav_fixed .header_list > li:last-child{
padding-right: 0px;
}
    
.nav_fixed .drawer_nav > li a{
color: #ffffff;
}
}




/* ========================================

    ■ Header■ Keyv

======================================== */
.keyv_outside{
    background-image: url("../img/main_bg.png");
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;}

#keyv {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    position: relative;}


.main_hamapon{position: absolute;
top:0;
right: 0;
width: 32%;}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.main_hamapon{position: absolute;
top: auto;   /* PCの top:0; を打ち消す */
    bottom: 0;   /* 親の内側の下端に配置 */
    right: auto; /* PCの right:0; を解除 */
	left: 3%;
width: 55%;}
}
/* -------------end------------- */



/* ========================================

    ■ common_item

======================================== */
.contents{width: 98%;
max-width: 1000px;
margin-left: auto;
margin-right: auto;
word-wrap: break-word;
overflow-wrap: break-word;
}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.contents{width: 90%;}
}
/* -------------end------------- */


/* ========================================

    ■ con1

======================================== */
.con1_outside{
	padding-top: 70px;
	padding-bottom: 70px;
	background-image: url(../img/con1_bg.png);
	background-repeat: repeat;
	background-position: center top;
	background-size: auto auto;
	border-top: 3px solid #c6a700;
    }

.con1_inner{
	padding: 50px;
	box-sizing: border-box;
	background-color: rgba(255,255,255,0.5);
	position: relative;
	background-image: url(../img/con1_yumekichi.png);
	background-repeat: no-repeat;
	background-position: right 20px top 30px;
	background-size: 16% auto;
    }

.con1_kazari {
position: absolute;
  top: 0;                 
  left: 50%;
  transform: translate(-50%, -50%); 
  margin: 0;
  width: 15%; 
}

.con1_title{text-align: center;
font-size: 250%;
font-weight: 700;
margin-bottom: 20px;
color: var(--red);
line-height: 1.4;}

.con1_lead{text-align: center;
font-size: 113%;
margin-bottom: 50px;}

.con1_copy{text-align: center;
font-size: 163%;
font-weight: 700;
margin-bottom: 50px;
color: var(--red);
line-height: 1.4;}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.con1_outside{
	padding-top: 35px;
	padding-bottom: 35px;
    }

.con1_inner{
	padding: 20px;
	background-image: url(../img/con1_yumekichi.png);
	background-repeat: no-repeat;
	background-position: right 10px top 10px;
	background-size: 16% auto;
    }

.con1_title{font-size: 200%;}

.con1_lead{text-align: left;
margin-bottom: 50px;}

.con1_copy{text-align: left;
font-size: 150%;
margin-bottom: 30px;}
}
/* -------------end------------- */



/* project_box***********---------------*/

.project_box {
    position: relative;
    padding:  30px;;
    border-radius: 6px;/*角の丸み*/
	background-color: var(--brown_20);
}
.project_box .project_box_title{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: inline-block;
    top: -10px;
    line-height: 1;
    background: var(--brown);/*タイトル文字背景色*/
    color: var(--beige);
    font-weight: 700;
    padding-top: 6px;
    padding-right: 5px;
    padding-left: 5px;
    padding-bottom: 6px;
    border-radius: 3px;/*角の丸み*/
    text-align: center;
    width: 10em;
}

/* project_flex ---------------*/
.project_flex_box{display: flex;
justify-content: space-between;
text-align: center;
margin-bottom: 20px;}

.project_flex_box li{width: 32%;
background-color: var(--beige_50);
padding: 10px;}

/* project_katsudo_flex ---------------*/
.project_katsudo_flex{display: flex;
justify-content: space-between;
margin-bottom: 20px;}

.project_katsudo_flex > li:first-child {
  width: 6em;   /* 固定幅 */
  flex-shrink: 0; /* 縮まないように指定（念のため） */
	margin-right: 1em;

}

.project_katsudo_flex > li:first-child p{
	background-color: var(--beige);
	color: var(--brown);
	padding-top: 3px;
	padding-right: 10px;
	padding-left: 10px;
	padding-bottom: 3px;
	border-radius: 3px;
	border: 1px solid var(--brown);
}

.project_katsudo_flex > li:last-child {
  flex: 1; /* 残りを可変で使用 */
}

.project_list li {
  position: relative;
  padding-left: 1.5em; /* アイコン分の余白 */
}

.project_list li::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900; /* solid 用 */
  content: "\f111"; /* fa-circle */
  position: absolute;
  left: 0;
  top: 0.4em; /* テキスト行の高さにあわせて微調整 */
  font-size: 0.6em; /* ドットを小さくする */
  color: var(--brown);
}


/* project_photo_flex ---------------*/
.project_photo_flex{display: flex;
justify-content: space-between;
margin-bottom: 20px;}

.project_photo_flex > li{
flex: 1;   /* 親幅を自動的に均等分割 */
}


/* 小さい画面用の設定-------------- */
@media (max-width:767px) {
.project_box {
padding:  15px;
	 padding-top: 30px;
}

/* project_flex ---------------*/
.project_flex_box{
flex-wrap: wrap;
margin-bottom: 20px;}

.project_flex_box li{width: 100%;
padding: 5px;
margin-bottom: 10px;}
	
.project_flex_box li:last-child{
margin-bottom: 0px;}

/* project_katsudo_flex ---------------*/
.project_katsudo_flex{flex-wrap: wrap;}

.project_katsudo_flex > li:first-child {
  width: 100%;  
	margin-bottom: 10px;
}

.project_katsudo_flex > li:last-child {
 width: 100%;   
}


/* project_photo_flex ---------------*/
.project_photo_flex {
    display: block; /* flexを解除して縦並びにする */
  }

  .project_photo_flex > li {
    width: 100%;         /* 横幅いっぱい */
  }

  .project_photo_flex > li img {
    width: 100%;   /* 画像を親幅いっぱいに */
    height: auto;  /* 縦横比を維持 */
    display: block;
  }
 }
/* -------------end------------- */


/* project_btn_flex ---------------*/
.project_btn_flex{display: flex;
justify-content: space-between;
}

.project_btn_flex > li{
	width: 48%;
	background-color: var(--brown);
	padding-top: 3px;
	padding-right: 10px;
	padding-left: 10px;
	padding-bottom: 3px;
	border-radius: 3px;
	position: relative; /* 擬似要素を配置するために必要 */
}

.project_btn_flex > li a{
color: var(--beige);
display: block;
}

 .project_btn_flex > li a::after {
  content: "\f105"; /* Font Awesome 5 Free の「fa-angle-right」 */
  font-family: "Font Awesome 5 Free"; /* バージョンに応じて変更 */
  font-weight: 900; /* solid アイコンの場合は必要 */
  position: absolute;
  right: 10px;       /* 右端から10px */
  top: 50%;          /* 上下中央基準 */
  transform: translateY(-50%); /* 完全に中央に */
  pointer-events: none; /* クリックの邪魔をしない */
}
/* .geisha_bosyuu ---------------*/
.geisha_bosyuu{border-bottom: 1px solid var(--brown);}

.geisha_bosyuu a{color: var(--red);}

/* bt_sponsor ---------------*/
.bt_sponsor a{
	
	background-color: var(--brown);
	padding-top: 3px;
	padding-right: 10px;
	padding-left: 10px;
	padding-bottom: 3px;
	border-radius: 3px;
	position: relative; /* 擬似要素を配置するために必要 */
	width: 25em;
	margin-left: auto;
	margin-right: 0;
}

.bt_sponsor a{
color: var(--beige);
display: block;
}

.bt_sponsor a::after {
  content: "\f105"; /* Font Awesome 5 Free の「fa-angle-right」 */
  font-family: "Font Awesome 5 Free"; /* バージョンに応じて変更 */
  font-weight: 900; /* solid アイコンの場合は必要 */
  position: absolute;
  right: 10px;       /* 右端から10px */
  top: 50%;          /* 上下中央基準 */
  transform: translateY(-50%); /* 完全に中央に */
  pointer-events: none; /* クリックの邪魔をしない */
}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.bt_sponsor a{
width: 100%;
}
}
/* -------------end------------- */
	
	/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.project_btn_flex{flex-wrap: wrap;
}

.project_btn_flex > li{
	width: 100%;
	margin-bottom: 10px;
	font-size: 89%;
}
.project_btn_flex > li:last-child{
	margin-bottom: 0px;
}

}
/* -------------end------------- */

/* remodal ---------------*/
.remodal_title{font-size: 125%;
margin-bottom: 30px;}

.remodal_txt{font-size: 94%;
text-align: left;}

.producer_name{font-size: 125%;
font-weight: 500;
margin-bottom: 20px;
text-align: left;}


.onigoroshi_flex_box{display: flex;
justify-content: space-between;}

.onigoroshi_flex_box > li{
width: 50%;

}



/* ========================================

    ■ con2

======================================== */
.con2_outside{
	padding-top: 70px;
	padding-bottom: 70px;
	background-image: url(../img/con2_bg.png);
	background-repeat: repeat;
	background-position: center top;
	background-size: auto auto;
    }

.con2_lead{text-align: center;
color: var(--red);
margin-bottom: 10px;
font-size: 150%;
font-weight: 500;}
	


.con2_sub_lead{text-align: center;
color: var(--brown);
margin-bottom: 30px;
font-size: 125%;
font-weight: 500;}


.con2_sub_lead > span{font-size: 75%;
font-weight: 400;}

.con2_title{text-align: center;
width: 77%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
}
	


.con2_inner {
  position: relative; /* 子要素のabsolute配置の基準にする */
  padding: 50px;
  box-sizing: border-box;
  background-color: rgba(255, 255, 255, 0.5);
  margin-bottom: 50px;
}
	

	

.con2_mini_title {
position: absolute;
  top: 0;                 
  left: 50%;
  transform: translate(-50%, -50%); 
  margin: 0;
  width: 36%; 
}
	
/* 小さい画面用の設定-------------- */
	@media (max-width:767px) {
	  .con2_outside {
	    padding-top: 35px;
	    padding-bottom: 35px;
	  }
	  .con2_lead {
	    font-size: 125%;
	  }
	  .con2_sub_lead {
	    text-align: left;
	    font-size: 125%;
	  }
	  .con2_title {
	    width: 100%;
	  }
	  .con2_inner {
	    padding: 20px;
		  padding-top: 30px;
	    margin-bottom: 30px;
	  }
	  .con2_mini_title {
	    width: 70%;
	  }
	}
	/* -------------end------------- */

.con2_fukidashi_wrap{position: relative;}
.con2_fukidashi{position: absolute;
width: 40%;
right: -10px;
	top:-20px;}

/* con2_step_flex ---------------*/
.con2_step_flex {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

.con2_step_flex li {
  width: 30%;}

.con2_step_title {
  margin-bottom: 10px;
}

/* con2_step_flex小さい画面用の設定-------------- */
@media (max-width:767px){
.con2_step_flex {
flex-wrap: wrap;
}
.con2_step_flex li {
  width: 100%;
	margin-bottom: 30px;}
.con2_step_flex li:last-child {
	margin-bottom: 0px;}
	
	.con2_step_img{width: 80%;
	margin-left: auto;
	margin-right: auto;}

}
/* -------------end------------- */



/* con2_step_title ---------------*/
.con2_step_title{text-align: center;
font-size: 125%;
margin-bottom: 20px;
color: var(--brown);
border: 1px solid var(--brown);}

.con2_step_txt{font-size: 107%;
margin-bottom: 10px;}

/* con2_step_title小さい画面用の設定-------------- */
@media (max-width:767px){
.con2_step_title{margin-bottom: 10px;}
}
/* -------------end------------- */

/* goods_wrap ---------------*/
.goods_wrap{background-color:rgba(246,235,216,0.80);
padding: 30px;
margin-bottom: 30px;
border-radius: 10px;}

.goods_title{color: var(--brown);
text-align: center;
margin-bottom: 20px;
font-size: 113%;
font-weight: 700;}



/* .con2_goods_flex ---------------*/
.con2_goods_flex {
  display: flex;
  justify-content: space-between;
}

.con2_goods_flex li {
  width: 23%;}

.con2_goods_flex li img{
margin-bottom: 10px;}

.goods_name{font-size: 82%;
text-align: center;
line-height: 1.4;}

/* .con2_goods_flex小さい画面用の設定-------------- */
@media (max-width:767px){
.goods_wrap{
padding: 15px;
margin-bottom: 15px;}

	
.con2_goods_flex {
flex-wrap: wrap;
}
.con2_goods_flex li {
  width: 48%;}
	
.con2_goods_flex li:nth-child(-n+2) {
margin-bottom: 15px;}



}
/* -------------end------------- */


/* con2_prize_flex ---------------*/
.con2_prize_flex {
  display: flex;
  justify-content: space-between;
margin-bottom: 20px;
}

.con2_prize_flex li {
  width: 23%;}

.con2_prize_title{
text-align: center;
font-size: 200%;
color: var(--red);
font-weight: 700;
	line-height: 1.4;
}

.con2_prize_flex li img{
margin-bottom: 10px;}


.con2_prize_name {
font-size: 113%;
}

/* con2_prize_flex小さい画面用の設定-------------- */
@media (max-width:767px){

.con2_prize_flex {
flex-wrap: wrap;
}

.con2_prize_flex li {
  width: 48%;}

.con2_prize_title{
font-size: 200%;
}

.con2_prize_flex li img{
margin-bottom: 10px;}

}
/* -------------end------------- */







/* ========================================

    ■ con3

======================================== */
.con3_outside {
  padding-top: 70px;
  padding-bottom: 0px;
  background-color: #F9EAED;
  background-image: url(../img/con3_bg_r.png), /* 最前面の背景レイヤーの背景画像 */ url(../img/con3_bg_l.png), url(../img/con3_bg_bottom.png);
  background-repeat:
    no-repeat, /* 最前面の背景レイヤーに対応 */ no-repeat, no-repeat;
  background-position:
    right top, /* 最前面の背景レイヤーに対応 */ left top, center bottom;
  background-size: 50% auto, 50% auto, contain;
}



.con3_title{text-align: center;
width: 40%;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.con3_outside {
  padding-top: 35px;
  padding-bottom: 0px;
  background-image: url(../img/con3_bg_r.png), /* 最前面の背景レイヤーの背景画像 */ url(../img/con3_bg_l.png), url(../img/con3_bg_bottom.png);
  background-repeat:
    no-repeat, /* 最前面の背景レイヤーに対応 */ no-repeat, no-repeat;
  background-position:
    right -20% top, 
	  /* 最前面の背景レイヤーに対応 */ 
	  left -20% top , 
	  center bottom;
  background-size: 50% auto, 
	  50% auto, 
	  120% auto;
}

.con3_title{width: 80%;
}
}
/* -------------end------------- */

.slide{margin-bottom: 50px!important;}

.slick-slide {
  height: auto;
  transform: scale(.70); /* スライドのサイズを70%にする*/
  transition: opacity .5s, transform .5s; /* スライド透過率と拡大のアニメーション時間を0.5秒に設定*/
  width: 100%;
}

/* 中央のスライド */
.slick-center {
  transform: scale(1); /*中央のスライドは小さくしない*/
}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
	.slide{width: 80%!important;
	margin-left: auto!important;
	margin-right: auto!important;}
	
.slick-slide {
transform: scale(1); /* スライドのサイズを100%にする*/
}
}
/* -------------end------------- */

.con3_name{text-align: center;
font-size: 125%;
margin-bottom:10px;}

.con3_kazari{width: 40%;
	margin-left: auto;
	margin-right: auto;
margin-bottom:10px;}

.con3_txt{width: 90%;
margin-left: auto;
margin-right: auto;
margin-bottom:10px;}


.con3_box{
	padding: 30px;
	background-color: rgba(255,255,255,0.50);
	margin-bottom: 50px;
    }

.con3_box_title{
	font-size: 150%;
	font-weight: 700;
	color: var(--red);
	margin-bottom: 20px;
	line-height: 1.4;
		text-align: center;

    }

.con3_box_txt{text-align: center;}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.con3_box{
	padding: 15px;
	margin-bottom: 30px;
    }

.con3_box_title{
	margin-bottom: 10px;
    }
	
	.con3_box_txt{text-align: left;}
}
/* -------------end------------- */





/* ========================================

    ■ con4

======================================== */
.con4_outside{
padding-top: 70px;
padding-bottom: 100px;
background-color: rgba(0,145,218,0.10);
border-top: 3px solid #0068B6;
    }


.con4_title{text-align: center;
width: 48%;
margin-left: auto;
margin-right: auto;
margin-bottom: 30px;
}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.con4_outside{
padding-top: 35px;
padding-bottom: 50px;
    }


.con4_title{width: 90%;
}
}
/* -------------end------------- */


/*.con4_flex ---------------*/
.con4_flex {
  display: flex;
  justify-content: space-between;
	margin-bottom: 30px;
}

.con4_flex li:first-child {
  width: 70%;}

.con4_flex li:last-child {
  width: 26%;}

.con4_marker{
background:linear-gradient(transparent 80%, #f6c 80%);
}

/* shop_linkを右揃え */
.shop_link {
    text-align: right;
    margin-bottom: 30px; 
}

/* a要素内の右矢印 */
.shop_link a {
    position: relative;
    display: inline-block;
    text-decoration: none;
    font-weight: 500;
}

.shop_link a::after {
    content: "\f105"; /* Font Awesome 右矢印 */
    font-family: "Font Awesome 5 Free"; /* または "Font Awesome 6 Free" */
    font-weight: 900; /* Solidの場合 */
    margin-left: 0.5em; /* テキストとの間隔 */
    display: inline-block;
}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.con4_flex {
flex-wrap: wrap;
}

.con4_flex li:first-child {
  width: 100%;
	margin-bottom: 20px;}

.con4_flex li:last-child {
  width: 50%;
	margin-left: auto;
	margin-right: auto;}
}
/* -------------end------------- */

/*.jisseki_title ---------------*/
/* 左右に横線 */
.jisseki_title {
  align-items: center; /* 横線を上下中央 */
  display: flex; /* 文字と横線を横並び */
  justify-content: center; /* 文字を中央寄せ */
	margin-bottom: 20px;
}
.jisseki_title::before,
.jisseki_title::after {
  background-color: #cccccc; /* 横線の色 */
  content: "";
  height: 1px; /* 横線の高さ */
  width: 60px; /* 横線の長さ */
}
.jisseki_title::before {
  margin-right: 15px; /* 文字との余白 */
}
.jisseki_title::after {
  margin-left: 15px; /* 文字との余白 */
}


/* ========================================

    ■ 画像が横スクロールし続ける無限ループ

======================================== */

.scroll-image {
  overflow: hidden;
}

.scroll-image ul {
  list-style: none;
  display: flex;
  width: max-content;
  animation: scrollAnimation 60s linear infinite;
}

@keyframes scrollAnimation {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-50%);
  }
}

.scroll-image ul li {
  width: calc(100vw / 10);
	/* 横幅は自動にしておく方が余白を効かせやすい */
  flex: 0 0 auto; 
  margin-right: 20px; /* ← 画像同士の間隔 */
}

.scroll-image ul li img {
  display: block;

}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.scroll-image ul li {
  width: calc(100vw / 4);
}

}
/* -------------end------------- */


/* ========================================

   .bt_btn

======================================== */

.btn_flex_box{display: flex;
justify-content: space-between;}

.btn_flex_box li{width: 48%;}

/* ul 内の li が1つだけの場合は中央揃え */
.btn_flex_box:has(li:only-child) {
    justify-content: center;
}

/* li が1つの場合は幅も少し調整（必要に応じて） */
.btn_flex_box:has(li:only-child) li {
    width: 48%; /* または max-width: 48%; など */
}

.bt_btn {
	background-color: var(--red);
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding-top: 15px;
	padding-bottom: 15px;
	text-align: center;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
	font-size: 125%;
  font-weight: 700;
	border-radius: 6px;
}
.bt_btn a {
	color: var(--beige);
	display: block;
}
.bt_btn:hover {
	-webkit-transform: translateY(-5px);
	-ms-transform: translateY(-5px);
	transform: translateY(-5px);
}

.bt_btn_hamapon {
	background-color: #d5007f;
	
}

.bt_btn_hamapon_02 {
	background-color: #F44974;
	
}

.bt_btn_hamapon a,
.bt_btn_hamapon_02 a{
	color: #ffffff;
}

/* 小さい画面用の設定-------------- */
@media (max-width:767px) {
.btn_flex_box{flex-wrap: wrap;}

.btn_flex_box li{width: 100%;}

.btn_flex_box li:first-child{margin-bottom: 20px;}

/* li が1つの場合は幅も少し調整（必要に応じて） */
.btn_flex_box:has(li:only-child) li {
    width: 100%; /* または max-width: 48%; など */
}
	
.bt_btn {
	width: 100%;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 113%;
}
}
/* -------------end------------- */


/* ====================================================
　page_btm_fixed
==================================================== */
#page_btm_fixed{
  position: fixed;
    right: 100px;
z-index: 9999999999;}


.page_btm_fixed_flex{display: flex;
justify-content: flex-end;
}

.page_btm_fixed_flex li{
width: 10em;
text-align: center;
box-sizing: border-box;
background-color: #c9124e;
text-align: center;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
 line-height: 1.4;
 display: flex;
 align-items: center;
justify-content: center;
margin-left: 10px;
line-height: 1.2em;

}

.page_btm_fixed_flex li:first-child{
background-color:var(--red);

}

.page_btm_fixed_flex li:last-child{
background-color: #d5007f;

}


.page_btm_fixed_flex li a{
    padding-top: 15px;
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 15px;
    display: block;
	color: #fff;
	font-weight: 700;
    font-size: 113%;
}


/* 小さい画面用の設定-------------- */
@media (max-width:767px){
#page_btm_fixed{
right: 50px;}


.page_btm_fixed_flex li{
margin-left: 5px;}


.page_btm_fixed_flex li a{
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
    font-size: 100%;
}
}
/* -------------end------------- */

/* ========================================

    ■ footer

======================================== */
.footer_outside {
  padding-top: 20px;
  padding-bottom: 80px;
  background-color: #17325f;
  color: #ffffff;
}

#event .footer_outside {
  padding-top: 20px;
  padding-bottom: 80px;
background-color: #9d5b8b;
}

.footer_flex {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
  font-size: 88%;
}
.footer_flex li:first-child {
  width: 45%;
}
.footer_flex li:last-child {
  width: 45%;
}
.footer_flex a {
  color: #ffffff;
}



.footer_c_name {
  font-size: 188%;
  font-weight: 700;
}

.add {
 font-size: 70%;
 text-align: center;
}



/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.footer_flex {
flex-wrap: wrap;
}
.footer_flex li:first-child {
  width: 100%;
	margin-bottom: 20px;
}
.footer_flex li:last-child {
  width: 100%;
}
}
/* -------------end------------- */


/* ====================================================
　pagetop
==================================================== */

.pagetop {
    display: none;
    position: fixed;
    bottom: 5px;
    right: 15px;
	z-index: 1000;
}
.pagetop a {
    display: block;
   color: #717071;
    font-size: 300%;
    
}
.pagetop a:hover {
display: block;}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.pagetop {
bottom: 3px;
right: 10px;
}
.pagetop a {font-size: 200%;}
}
/* -------------end------------- */


/* PC向けレイアウトの指定：481px以上では固定レイアウト */
.miniimage {
    display: none;
}  /* miniを非表示 */
.bigimage {
    display: block;
    line-height: 0px;
} /* bigを表示 */

@media screen and (max-width: 480px) {
.miniimage {
    display: block;
    line-height: 0px;
} /* miniを表示 */
.bigimage {
    display: none;
}   /* bigを非表示 */
}

/*  PCのみに表示するメニュー*/
.only_smt { display: none; }  /* miniを非表示 */
.only_pc  { display: block; 
} /* bigを表示 */
	
/*  スマホのみに表示するメニュー*/
@media only screen and (max-width: 768px) {
.only_smt {
	display: block;
	
} /* miniを表示 */
.only_pc  { display: none; }   /* bigを非表示 */
}




.schedule_title {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 225%;
	color: #c6314f;
	text-align: center;
	margin-bottom: 10px;
}

.schedule_title::before,
.schedule_title::after {
	content: '';
	width: 70px;
	height: 3px;
	background-color: #c6314f;
}

.schedule_title::before {
	margin-right: 20px;
}
.schedule_title::after {
	margin-left: 20px;
}

.schedule_title_lead{
	margin-bottom: 30px;
	text-align: center;
	font-size: 100%;
}

/* 小さい画面用の設定-------------- */
@media (max-width:767px){
.schedule_title {
	font-size: 175%;
	line-height: 1.2;
}
	
.schedule_title::before,
.schedule_title::after {
width: 30px;
}

.schedule_title::before {
	margin-right: 10px;
}
.schedule_title::after {
	margin-left: 10px;
}

}
/* -------------end------------- */