@import url('https://fonts.googleapis.com/css2?family=BIZ+UDGothic:wght@400;700&family=BIZ+UDPGothic:wght@400;700&family=Noto+Serif+JP:wght@200..900&display=swap');
/* -- 背景（+）-- */
.bg_plus {
    --s: 62px; /* control the size*/
    --c1: #cf000e;
    --c2: #d9333e;
    --c3: #cf000e;
    --c: #0000 48%, var(--c1) 0 52%, #0000 0;
    background:
        linear-gradient(-90deg, var(--c)), linear-gradient(90deg, var(--c)), repeating-conic-gradient(from 90deg, var(--c2) 0 25%, var(--c3) 0 50%);
    background-size: var(--s) var(--s);
}
.bg_paper {
    background-color: #fff;
    opacity: 0.8;
    background-image: linear-gradient(#ccc 2px, transparent 2px), linear-gradient(90deg, #ccc 2px, transparent 2px), linear-gradient(#ccc 1px, transparent 1px), linear-gradient(90deg, #ccc 1px, #e5e5f7 1px);
    background-size: 50px 50px, 50px 50px, 10px 10px, 10px 10px;
    background-position: -2px -2px, -2px -2px, -1px -1px, -1px -1px;
}
.bg_wave {
    background-color: #cf000e;
    background-image: radial-gradient(circle at 100% 150%, #cf000e 24%, #d9333e 24%, #d9333e 28%, #cf000e 28%, #cf000e 36%, #d9333e 36%, #d9333e 40%, transparent 40%, transparent), radial-gradient(circle at 0 150%, #cf000e 24%, #d9333e 24%, #d9333e 28%, #cf000e 28%, #cf000e 36%, #d9333e 36%, #d9333e 40%, transparent 40%, transparent), radial-gradient(circle at 50% 100%, #d9333e 10%, #cf000e 10%, #cf000e 23%, #d9333e 23%, #d9333e 30%, #cf000e 30%, #cf000e 43%, #d9333e 43%, #d9333e 50%, #cf000e 50%, #cf000e 63%, #d9333e 63%, #d9333e 71%, transparent 71%, transparent), radial-gradient(circle at 100% 50%, #d9333e 5%, #cf000e 5%, #cf000e 15%, #d9333e 15%, #d9333e 20%, #cf000e 20%, #cf000e 29%, #d9333e 29%, #d9333e 34%, #cf000e 34%, #cf000e 44%, #d9333e 44%, #d9333e 49%, transparent 49%, transparent), radial-gradient(circle at 0 50%, #d9333e 5%, #cf000e 5%, #cf000e 15%, #d9333e 15%, #d9333e 20%, #cf000e 20%, #cf000e 29%, #d9333e 29%, #d9333e 34%, #cf000e 34%, #cf000e 44%, #d9333e 44%, #d9333e 49%, transparent 49%, transparent);
    background-size: 100px 50px;
}
.bg_wave_blue {
    background-color: #0368b8;
    background-image: radial-gradient(circle at 100% 150%, #0368b8 24%, #577cba 24%, #577cba 28%, #0368b8 28%, #0368b8 36%, #577cba 36%, #577cba 40%, transparent 40%, transparent), radial-gradient(circle at 0 150%, #0368b8 24%, #577cba 24%, #577cba 28%, #0368b8 28%, #0368b8 36%, #577cba 36%, #577cba 40%, transparent 40%, transparent), radial-gradient(circle at 50% 100%, #577cba 10%, #0368b8 10%, #0368b8 23%, #577cba 23%, #577cba 30%, #0368b8 30%, #0368b8 43%, #577cba 43%, #577cba 50%, #0368b8 50%, #0368b8 63%, #577cba 63%, #577cba 71%, transparent 71%, transparent), radial-gradient(circle at 100% 50%, #577cba 5%, #0368b8 5%, #0368b8 15%, #577cba 15%, #577cba 20%, #0368b8 20%, #0368b8 29%, #577cba 29%, #577cba 34%, #0368b8 34%, #0368b8 44%, #577cba 44%, #577cba 49%, transparent 49%, transparent), radial-gradient(circle at 0 50%, #577cba 5%, #0368b8 5%, #0368b8 15%, #577cba 15%, #577cba 20%, #0368b8 20%, #0368b8 29%, #577cba 29%, #577cba 34%, #0368b8 34%, #0368b8 44%, #577cba 44%, #577cba 49%, transparent 49%, transparent);
    background-size: 100px 50px;
}
.bg_wave_green {
    background-color: #007b43;
    background-image: radial-gradient(circle at 100% 150%, #007b43 24%, #009954 24%, #009954 28%, #007b43 28%, #007b43 36%, #009954 36%, #009954 40%, transparent 40%, transparent), radial-gradient(circle at 0 150%, #007b43 24%, #009954 24%, #009954 28%, #007b43 28%, #007b43 36%, #009954 36%, #009954 40%, transparent 40%, transparent), radial-gradient(circle at 50% 100%, #009954 10%, #007b43 10%, #007b43 23%, #009954 23%, #009954 30%, #007b43 30%, #007b43 43%, #009954 43%, #009954 50%, #007b43 50%, #007b43 63%, #009954 63%, #009954 71%, transparent 71%, transparent), radial-gradient(circle at 100% 50%, #009954 5%, #007b43 5%, #007b43 15%, #009954 15%, #009954 20%, #007b43 20%, #007b43 29%, #009954 29%, #009954 34%, #007b43 34%, #007b43 44%, #009954 44%, #009954 49%, transparent 49%, transparent), radial-gradient(circle at 0 50%, #009954 5%, #007b43 5%, #007b43 15%, #009954 15%, #009954 20%, #007b43 20%, #007b43 29%, #009954 29%, #009954 34%, #007b43 34%, #007b43 44%, #009954 44%, #009954 49%, transparent 49%, transparent);
    background-size: 100px 50px;
}
.bg_wave_mono {
    background-color: #fff;
    background-image: radial-gradient(circle at 100% 150%, #fff 24%, #eee 24%, #eee 28%, #fff 28%, #fff 36%, #eee 36%, #eee 40%, transparent 40%, transparent), radial-gradient(circle at 0 150%, #fff 24%, #eee 24%, #eee 28%, #fff 28%, #fff 36%, #eee 36%, #eee 40%, transparent 40%, transparent), radial-gradient(circle at 50% 100%, #eee 10%, #fff 10%, #fff 23%, #eee 23%, #eee 30%, #fff 30%, #fff 43%, #eee 43%, #eee 50%, #fff 50%, #fff 63%, #eee 63%, #eee 71%, transparent 71%, transparent), radial-gradient(circle at 100% 50%, #eee 5%, #fff 5%, #fff 15%, #eee 15%, #eee 20%, #fff 20%, #fff 29%, #eee 29%, #eee 34%, #fff 34%, #fff 44%, #eee 44%, #eee 49%, transparent 49%, transparent), radial-gradient(circle at 0 50%, #eee 5%, #fff 5%, #fff 15%, #eee 15%, #eee 20%, #fff 20%, #fff 29%, #eee 29%, #eee 34%, #fff 34%, #fff 44%, #eee 44%, #eee 49%, transparent 49%, transparent);
    background-size: 100px 50px;
}
.bg-outline {
    background: linear-gradient(#fff 50%, rgba(255, 255, 255, 0) 0) 0 0, radial-gradient(circle closest-side, #fff 53%, rgba(255, 255, 255, 0) 0) 0 0, radial-gradient(circle closest-side, #fff 50%, rgba(255, 255, 255, 0) 0) 40px 0 #0368b8;
    background-size: 80px 200px;
    background-repeat: repeat-x;
}
/* -- 施設紹介用背景 -- */
.bg_floor01 {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.75)), url("/floor_info/img/f1_header.jpg");
    /*background-attachment: fixed;*/
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-backdrop-filter: brightness(0.2);
    backdrop-filter: brightness(0.2);
}
/* -- 施設紹介用背景 -- */
.bg_floor02 {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.75)), url("/floor_info/img/f2_header.jpg");
    /*background-attachment: fixed;*/
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* -- 宴チャンネル用背景 -- */
.bg_flower {
  --s: 20px; /* control the size*/
  --c1: #ffe852;
  --c2: #fff19c;
  
  --_g: #0000 83%,var(--c1) 85% 99%,#0000 101%;
  background:
    radial-gradient(27% 29% at right ,var(--_g)) calc(var(--s)/ 2) var(--s),
    radial-gradient(27% 29% at left  ,var(--_g)) calc(var(--s)/-2) var(--s),
    radial-gradient(29% 27% at top   ,var(--_g)) 0 calc(var(--s)/ 2),
    radial-gradient(29% 27% at bottom,var(--_g)) 0 calc(var(--s)/-2)
    var(--c2);
  background-size: calc(2*var(--s)) calc(2*var(--s));
}

.btn-danger:hover {
	color: #fff!important;
}
.btn-outline-danger:hover {
	color: #fff!important;
	background: #dc3545;
}

.bg_parallax {
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
    background-size: cover;
	min-height: 500px;
	position: relative;
}
.bg_parallax01 {
	background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.75)), url("/assets/img/para_bg01.jpg");
}

/*--------------------------------------------------------------

# 文字装飾

--------------------------------------------------------------*/
.text_shadow02 {
    text-shadow: 4px 4px 4px rgba(0, 0, 0, .75);
}
/*--------------------------------------------------------------

# テーブル

--------------------------------------------------------------*/
.layout_fixed {
    table-layout: fixed;
}
.page-item.active .page-link {
    background-color: #f00;
    border-color: #f00;
}

/* -- レスポンシブテーブル -- */
.tbl-r02 table {
	font-size: .8em;
}
.tbl-r02 th {
	background: #fff;
	border-top: solid 1px #ccc;
	border-bottom: solid 1px #ccc;
	color: #333;
	font-size: .8em;
	padding: 10px;
	white-space: nowrap;
}
.tbl-r02 td {
	border-top: solid 1px #ccc;
	border-bottom: solid 1px #ccc;
	padding: 10px;
	font-size: .8em;
}
 
@media screen and (max-width: 640px) {
	.last td:last-child {
		border-bottom: solid 1px #ccc;
		width: 100%;
	}
	.tbl-r02 {
		width: 80%;
	}.tbl-r02 th, .tbl-r02 td {
		border-bottom: none;
		display: block;
		width: 100%;
	}
}

/*--------------------------------------------------------------

# 上下中央配置

--------------------------------------------------------------*/
.v_center {
  display: flex;
  justify-content: center;
  align-items: center;
}

/*--------------------------------------------------------------

# ページネーション

--------------------------------------------------------------*/
.page-item.active .page-link {
    background-color: #cf000e;
    border-color: #cf000e;
}
a .page-link {
    color: #cf000e;
}
.page-item a:hover {
    color: #00f;
}
.page-item a {
    color: #cf000e;
}
/*--------------------------------------------------------------

# ヘッダー（チケットリンクボタン）

--------------------------------------------------------------*/
.header .btn-get-ticket, .header .btn-get-ticket:focus {
    color: #fff;
    background: #0068FA;
    font-size: 14px;
    padding: 8px 25px;
    margin: 0 0 0 30px;
    border-radius: 50px;
    transition: 0.3s;
}
.header .btn-get-ticket:hover, .header .btn-get-ticket:focus:hover {
    color: var(--contrast-color);
    background: color-mix(in srgb, #0068FA, transparent 15%);
}
@media (max-width: 1200px) {
    .header .logo {
        order: 1;
    }
    .header .btn-getstarted {
        order: 2;
        margin: 0 10px 0 0;
        padding: 6px 10px;
    }
    .header .btn-get-ticket {
        order: 3;
        margin: 0 10px 0 0;
        padding: 6px 10px;
    }
    .header .navmenu {
        order: 4;
    }
}
/*--------------------------------------------------------------

# トップページ新規ボタン

--------------------------------------------------------------*/
/* -- トップページ用ブースボタン -- */
/* -- パビリオンボタン --*/
.tarminal_btn a.btn_09 {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #795548;
    text-align: center;
    text-decoration: none;
    width: 100%;
    height: 100px;
    padding: 20px 20px 20px 30px;
    background-color: #fff;
    border: 5px double #ffc107;
    border-radius: 50px;
    box-sizing: border-box;
    position: relative;
    transition-duration: 0.3s;
}
.tarminal_btn a.btn_09::before {
    content: '';
    width: 70px;
    height: 70px;
    position: absolute;
    top: 50%;
    left: 20px;
    margin-top: -35px;
    background-image: url("../img/utage_logo02.svg");
    background-size: contain;
    background-repeat: no-repeat;
}
.tarminal_btn a.btn_09 span {
    font-size: 1.0em;
    font-weight: bold;
    line-height: 1.2;
}
.tarminal_btn a.btn_09 span span {
    display: block;
    font-size: 1.7em;
    margin-bottom: 7px;
}
.tarminal_btn a.btn_09:hover {
    color: #ffffff;
    background-color: #FFC107;
}
/* -- フード -- */
.button_solid016 a {
    background: #d9333e;
    border-radius: 3px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    width: 100%;
    padding: 20px 45px;
    color: #fff;
    transition: 0.3s ease-in-out;
    font-weight: 700;
    z-index: 1;
    border-radius: 5px;
}
.button_solid016 a:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -1;
    border-radius: 5px;
    background: #d9333e;
    background-image:
        linear-gradient(45deg, #cf000e 25%, transparent 0), linear-gradient(45deg, transparent 75%, #cf000e 0), linear-gradient(45deg, #cf000e 25%, transparent 0), linear-gradient(45deg, transparent 75%, #cf000e 0);
    background-position: 0 0, 15px 15px, 15px 15px, 30px 30px;
    background-size: 30px 30px;
}
.button_solid016 a:after {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    content: '';
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-transform: translate3d(0, 0.40rem, -1rem);
    transform: translate3d(0, 0.40rem, -1rem);
    border: 2px solid #000;
    border-radius: inherit;
    background: #d9333e;
    -webkit-box-shadow: 0 0.6rem 0 0 rgb(0 0 0 / 20%);
    box-shadow: 0 0.4rem 0 0 rgb(0 0 0 / 20%);
    z-index: -2;
}
.button_solid016 a i {
    position: absolute;
    right: 9px;
}
.button_solid016 a:hover {
    transform: translate3d(0, 0.2rem, -1rem);
}
.button_solid016 a:hover:after {
    transform: translate3d(0, 0.2rem, -1rem);
    box-shadow: 0 0.2rem 0 0 rgb(0 0 0 / 20%);
}
/* -- フッピーのボタン2 -- */
a.foopy_btn02 {
    padding: .25em 1em;
    margin: 0;
    display: block;
    color: #fff;
    background: #ff0002;
    border: 8px double #fff;
    text-decoration: none;
    font-weight: 700;
    font-size: 1em;
    border-radius: 24px;
    text-align: center;
    text-decoration: none;
    transition: .3s;
}
a.foopy_btn02:before {
    content: "";
    display: inline-block;
    width: 60px;
    height: 60px;
    margin: -3px 5px 0 0;
    background: url("../img/foopy00.png") no-repeat;
    background-size: contain;
    background-position: left;
    vertical-align: middle;
}
a.foopy_btn02:hover {
    background-color: #ff5c4b;
}
a.foopy_btn02 img {
    margin-top: -100px;
}
@media screen and (max-width: 768px) {
    a.foopy_btn02 {
        padding: 0.5em .8em;
        margin: 10px auto;
        font-size: 1em;
        display: inline-block;
        white-space: nowrap;
    }
    a.foopy_btn02:before {
        width: 40px;
        height: 40px;
        margin: -3px 10px 0 0;
    }
}
@media screen and (max-width: 400px) {
    a.foopy_btn02 {
        padding: 0.5em .5em;
        margin: 10px auto;
        font-size: .8em;
        display: inline-block;
        white-space: nowrap;
    }
    a.foopy_btn02:before {
        width: 40px;
        height: 40px;
        margin: -3px 10px 0 0;
    }
}
/* -- スケジュールボタン -- */
.hero .btn-schedule02 {
    color: var(--contrast-color);
    background: var(--accent-color);
    font-family: var(--heading-font);
    font-weight: 700;
    font-size: 1.75em;
    letter-spacing: 1px;
    display: inline-block;
    padding: 10px 28px;
    border-radius: 50px;
    transition: 0.5s;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1);
}
.hero .btn-schedule02:hover {
    color: var(--contrast-color);
    background: color-mix(in srgb, var(--default-color), transparent 15%);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1);
}
/* -- スケジュールボタン -- */
.btn-schedule02_01 {
    color: #333;
    background: #fff;
    font-family: var(--heading-font);
    font-weight: 700;
    font-size: 1.2em;
    text-align: center;
    letter-spacing: 1px;
    display: inline-block;
    width: 100%;
    padding: 10px 0;
    border-radius: 50px;
    transition: 0.5s;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1);
}
.btn-schedule02_01 a {
    color: #333;
}
.hero .btn-schedule02_01:hover {
    color: var(--contrast-color);
    background: color-mix(in srgb, var(--default-color), transparent 15%);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.1);
}
/*.btn_schedule03 p {
	color: #333;
	padding: 5px 0;
	text-decoration: none;
	font-size: 1em;
	border: 1px solid #333;
	width: 100%;
	text-align: left;
}

.btn_schedule03 p span {
	background: none;
	font-size: 90%;
	margin-right: .5em;
	padding: 12px;
	text-align: left;
	width: 180px;
}*/



/* -- 固定ボタン -- */
.fixed_btn {
    position: fixed;
    top: 130px;
    right: 10px;
    width: 120px;
    height: 40px;
    line-height: 37px;
    text-align: center;
    background: #0068FA;
    color: #fff;
    font-size: .85em;
    font-weight: 700;
    border-radius: 20px;
    border: 2px solid #fff;
	z-index: 289;
}
.fixed_btn:hover {
    color: #eee;
}

/* -- アニメーションボタン（アクセス） -- */
.btn_ani01 {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 300px;
    height: 50px;
    box-sizing: border-box;
	border: 4px solid #fff;
    border-radius: 25px;
    background-color: #cf000e;
    text-align: center;
    text-decoration: none;
	font-weight: 900;
    overflow: hidden;
    transition: 1s all;
}


.btn_ani01 svg {
    position: absolute;
    inset: 0;
    margin: auto;
    height: 40px;
    fill: #fff;
    transition: .5s all;
    opacity: 0;
}

.btn_ani01 span {
    color: #fff;
    text-align: center;
    z-index: 1;
}

.btn_ani01:hover span {
    animation: textAnime 1s linear forwards;
}

.btn_ani01:hover svg {
    animation: iconAnime 1s 0.7s linear forwards;
}

@keyframes textAnime {
    0% {
        transform: scaleX(1);
    }

    50% {
        font-weight: bold;
        transform: scaleX(1.3);
        opacity: 1;
    }

    100% {
        transform: scaleX(0.3);
        opacity: 0;
    }

}

@keyframes iconAnime {
    0% {
        opacity: 1;
    }

    25% {
        transform: rotate(-20deg);
    }

    50% {
        transform: rotate(20deg);
    }

    75% {
        transform: rotate(-20deg);
    }

    100% {
        opacity: 1;
    }

}


/* -- 宴チャンネルindex ボタン --*/
a.btn_ch {
  display: flex;
  justify-content: center;
  align-items: center;
  color: #795548;
  text-align: center;
  text-decoration: none;
  width: 100%;
  min-height: 80px;
  padding: 25px 20px 20px 85px;
  /*border: 5px solid #fff;*/
  border-radius: 10px;
  box-sizing: border-box;
  position: relative;
  transition-duration: 1.3s;
	background-color: none;
}
a.btn_ch::before {
  content: '';
  width: 200px;
  height: 200px;
  position: absolute;
  top: 50%;
  left: -60px;
  margin-top: -80px;
  background-image: url("/assets/img/foopy_sdgs.svg");
  background-size: contain;
  background-repeat: no-repeat;
}
a.btn_ch:hover {
  color: #ffffff;
  background-color: none;
}

.text-wrap {
	display: flex;
	position: absolute;
	left: 50%;
	bottom: 3%;
	transform: translate(-50%, -50%);
}

.text-wrap:hover .letter {
  background-color: hsl(calc((var(--index) + 360) * 24deg) 80% 60%);
  color: #fff;
}

.letter {
  width: 45px;
  height: 45px;
  display: grid;
  place-content: center;
  overflow: hidden;
  transition: 0.6s background-color;
  transition-delay: calc(var(--index) * 0.05s);
  color: #fff;
  background-color: red;
	font-weight: bold;
}
.sr-only {
  position: absolute;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border-width: 0;
  white-space: nowrap;
}

@media screen and (max-width: 768px) {
	a.btn_ch {
		min-height: 80px;
		padding: 25px 20px 20px 75px;
	}
a.btn_ch::before {
		width: 90px;
		height: 90px;
		top: 50%;
		left: 0px;
		margin-top: -30px;
	}
	.text-wrap {
		bottom: 20%;
		margin-bottom: 0;
}
	.letter {
		width: 27px;
		height: 27px;
	}
}


/*--------------------------------------------------------------

# 囲みボックスデザイン

--------------------------------------------------------------*/
/* -- 開館時間ボックス -- */
.time_box {
    padding: .5em 1em 0;
    border-radius: 20px;
    border: 4px solid #cf000e;
    background:
        linear-gradient(90deg, transparent 10%, #fff 10% 90%, transparent 90%),
        linear-gradient(45deg, #cf000e 25%, transparent 25%, transparent 75%, #cf000e 75%),
        linear-gradient(45deg, #cf000e 25%, #cd5237 25%, #cd5237 75%, #cf000e 75%);
    background-position: 0 0, 15px 15px;
    background-size: 100% 100%, 30px 30px, 30px 30px;
    color: #333;
    width: 25%;
	height: 90px;
}

.time_box p {
    color: 333;
    font-size: 1.3em;
    font-weight: 900;
    line-height: 1.5;
}

.time_box span {
    font-size: 70%;
}

@media screen and (max-width: 768px) {
	.time_box {
		padding: .25em .25em 0;
		width: 75%;
		height: 90px;
	}
	.time_box p {
		font-size: 1.2em;
		line-height: 1.5;
	}
}

@media screen and (max-width: 400px) {
	.time_box {
		padding: .25em .25em 0;
		width: 100%;
		height: 90px;
	}
	.time_box p {
		font-size: 1em;
		line-height: 1.5;
	}
}

/*--------------------------------------------------------------

# 宴チャンネルコンテンツカード

--------------------------------------------------------------*/
figure.movie_card01 {
	color: #fff;
	position: relative;
	overflow: hidden;
	margin: 1%;
	width: 98%;
	background-color: #fff;
	color: #333;
	text-align: left;
	font-size: 16px;
	border: 1px solid #ccc;
	border-radius: 8px;
}
figure.movie_card01 * {
	box-sizing: border-box;
	transition: all 0.2s ease;
}
figure.movie_card01 img {
	max-width: 100%;
	vertical-align: top;
	transform-origin: 50% 100%;
	transition: all 0.4s ease;
}
figure.movie_card01 figcaption {
	padding: 10px;
	position: relative;
	min-height: 120px;
}
figure.movie_card01 .icon i {
	background-color: #f00;
	color: #fff;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -80px);
	min-height: 50px;
	min-width: 50px;
	line-height: 50px;
	position: absolute;
	font-size: 1.2em;
	text-align: center;
	border-radius: 50%;
}
figure.movie_card01 h3, figure.movie_card01 p {
	margin: 0;
	padding: 0;
}
figure.movie_card01 h3 {
	margin-bottom: 1em;
	display: inline-block;
	font-weight: 600;
	font-size: 1.1em;
	color: #333;
	text-transform: uppercase;
}
figure.movie_card01 p {
	font-size: 0.8em;
	margin-bottom: 5px;
	line-height: 1;
}
figure.movie_card01 i {
	font-size: 1.5em;
	margin-right: 8px;
	line-height: 1;
}
figure.movie_card01 button {
	padding: 10px 20px;
	width: 100%;
	background-color: #f00;
	border: none;
	border-radius: 8px;
	font-weight: 600;
	color: #fff;
	letter-spacing: 2px;
	font-size: 0.8em;
}
figure.movie_card01 a {
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	position: absolute;
	z-index: 1;
}
figure.movie_card01:hover img {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}
figure.movie_card01:hover button, figure.movie_card01.hover button {
	background-color: #D40000;
}

/*--------------------------------------------------------------

# 見出し設定

--------------------------------------------------------------*/
.midashi_design03 {
    border-bottom: solid 3px #0368b8;
    position: relative;
    margin: 2em 0 1em;
}
.midashi_design03:after {
    position: absolute;
    content: " ";
    display: block;
    border-bottom: solid 3px #cf000e;
    bottom: -3px;
    width: 30%;
}
/* -- 白文字三点アンダー付き -- */
.midashi_design04 {
    font-weight: 700;
    padding-bottom: 0.7em;
    text-align: center;
    position: relative;
    color: #fff;
    font-size: 2.75em;
}
.midashi_design04::after {
    content: '';
    position: absolute;
    border-bottom: 10px dotted #fff;
    width: 50px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
.midashi_design04 h2 {
    font-weight: 700;
}
/*--------------------------------------------------------------

# リストデザイン

--------------------------------------------------------------*/
li::marker {
    color: red; /* 点の色を赤色にする */
}

/*-  宴キャンペーンについて内リスト -- */
.list_design01 {
	/*list-style-type: none;*/
    padding: 2em;
    border-style: solid solid;
    border-width: 5px;
    border-color: #e30012 #e30012 #0068b4 #0068b4;
	font-size: 90%;
}

.list_design01 li {
	margin-bottom: 1em;
}

.list_design01 li::marker {
	color: #e30012;
}

@media (max-width: 689px) {
	.list_design01 {
		padding: 2em;
	}
}

/*--------------------------------------------------------------

# ボックスデザイン（サブタイトル付き）

--------------------------------------------------------------*/
.box_design02 {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #cf000e;
}
.box_design02 .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 1em;
    background: #cf000e;
    color: #fff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}

.box_design04 {
    margin: 0;
    padding: 30px;
    box-shadow: 0 0 0 10px #f1f1f1;
    border-style: solid solid;
    border-width: 5px;
    border-color: #CDE7F3 #f2cdd7 #cdf2d3 #f2eecd;
    background-color: #fff;
}

.box_design04 p {
    line-height: 1.5;
}

/*--------------------------------------------------------------

# スケジュールテーブル

--------------------------------------------------------------*/
/* table03 */
.table03 table {
    width: 100%;
    display: block;
    overflow-x: scroll;
    white-space: nowrap;
}
.table03 th, .table03 td {
    text-align: center;
    width: 20%;
    min-width: 160px;
    padding: 10px;
    height: 60px;
    font-size: .8em;
    vertical-align: middle;
}
.table03.layout_fixed td {
    padding: 10px 5px;
}

.table03 th {
    background-color: none;
}
.table03 .head {
    background-color: none;
    width: 95px;
}
.table03 th.fixed {
    position: sticky;
    left: 0;
    min-width: 95px;
}
.table05 .fixed:before {
    content: "";
    position: absolute;
    top: 0;
    left: -1px;
    right: -1px;
    height: 100%;
    border-left: 1px solid #707070;
    border-right: 1px solid #707070;
}
/* tab */
@media only screen and (max-width: 768px) {
    .table03 {
        display: block;
        overflow-x: scroll;
        white-space: nowrap;
    }
    .table03 .fixed {
        position: sticky;
        left: 0;
    }
    .table05 .fixed:before {
        content: "";
        position: absolute;
        top: 0;
        left: -1px;
        right: -1px;
        height: 100%;
        border-left: 1px solid #707070;
        border-right: 1px solid #707070;
    }
}
.shop_name {
    display: block ruby;
    width: 18em;
    text-align: justify;
    text-align-last: justify;
    float: left;
}
.aki {
    width: 15em;
    float: left;
}
/*--------------------------------------------------------------

# 出店ブース（個別店舗紹介）

--------------------------------------------------------------*/
/* -- 店舗名（画像） -- 
.midashi_design05 {
    position: relative;
    margin-top: 5rem;
    padding: 2rem;
    text-align: center;
    border: 8px double #000;
    background: #fff;
    width: 100%;
}
.midashi_design05:before, .midashi_design05:after {
    position: absolute;
    content: '';
}
.midashi_design05:before {
    top: -110px;
    left: calc(50% - 110px);
    width: 220px;
    height: 220px;
    border: 8px double #000;
    border-radius: 50%;
    background: #fff;
}
.midashi_design05:after {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
}
.midashi_design05 h3 {
    font-size: 2rem;
    padding-bottom: 1rem;
}

.midashi_design05 p {
    color: #333;
}
.midashi_design05 span.booth_num {
    font-size: .7em;
    line-height: 40px;
    position: absolute;
    z-index: 1;
    top: -55px;
    left: calc(50% - 90px);
    width: 180px;
    height: 160px;
    text-align: center;
}
.midashi_design05 span.booth_num strong {
    font-style: italic;
    font-size: 1.5em;
}
.midashi_design05 span {
    position: relative;
    z-index: 1;
}
.midashi_design05 span.booth_title {
    position: relative;
    padding-bottom: .5rem;
    border-bottom: 4px dotted #333;
    z-index: 3;
    font-weight: 900;
    width: 100%;
}
.midashi_design05 img {
    position: relative;
    z-index: 2;
}
*/
.midashi_design05 {
    position: relative;
    margin-top: 5rem;
    padding: 2rem;
    text-align: center;
    border: 8px double #000;
    background: #fff;
    width: 100%;
}
.midashi_design05:before, .midashi_design05:after {
    position: absolute;
    content: '';
}
.midashi_design05:before {
    top: -120px;
    left: calc(50% - 120px);
    width: 240px;
    height: 240px;
    border: 8px double #000;
    border-radius: 50%;
    background: #fff;
}
.midashi_design05:after {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
}
.midashi_design05 h3 {
    font-size: 2rem;
    padding-bottom: 1rem;
}
.midashi_design05 p {
    color: #333;
}
.midashi_design05 span.booth_num {
    font-size: 1.7em;
    font-weight: 900;
    line-height: 40px;
    position: absolute;
    z-index: 1;
    top: -105px;
    left: calc(50% - 120px);
    width: 240px;
    height: 240px;
    text-align: center;
}
.midashi_design05 span.booth_num img {
    width: 100px;
}
.midashi_design05 span.booth_num p {
    font-size: 1.25em;
}
.midashi_design05 span {
    position: relative;
    z-index: 1;
}
.midashi_design05 span.booth_title {
    position: relative;
    padding-bottom: .5rem;
    margin-bottom: 2em;
    border-bottom: 4px dotted #333;
    z-index: 3;
    font-size: 2em;
    font-weight: 900;
    width: 100%;
}
.midashi_design05 img {
    position: relative;
    z-index: 2;
}
@media screen and (max-width: 640px) {
    .midashi_design05 span.booth_num p {
        font-size: 1em;
    }
    .midashi_design05 span.booth_title {
        font-size: 1.5em;
    }
}
/* -- セールスポイントボックス -- */
.booth_seles_point {
    background-color: #fff;
    background-image: linear-gradient(#eee 0.1em, transparent 0.1em);
    background-size: 100% 1.2em;
    padding: 2.5em 2em 2em;
    position: relative;
    z-index: 3;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
    text-align: left;
}
.booth_seles_point .box-title {
    background-color: rgba(220, 196, 130, .4);
    border-left: 2px dotted rgba(175, 158, 110, 1);
    border-right: 2px dotted rgba(175, 158, 110, 1);
    box-shadow: 0 0 5px rgba(0, 0, 0, .4);
    transform: rotate(-2deg);
    font-size: 1em;
    font-weight: 700;
    color: #666;
    padding: 15px 20px;
    line-height: 1;
    position: absolute;
    top: -20px;
    left: 20px;
}
.booth_seles_point {
    font-size: 1.2em;
}
.food {
    background-color: orangered;
    color: #fff;
    font-size: .8em;
    width: 100px;
    margin-right: 5px;
}
.event {
    background-color: skyblue;
    color: #fff;
    font-size: .8em;
    width: 100px;
    margin-right: 5px;
}
.display {
    background-color: darkgreen;
    color: #fff;
    font-size: .8em;
    width: 100px;
    margin-right: 5px;
}
/* -- レスポンシブテーブル -- */
.res_tb01 table {
    border-collapse: collapse;
    width: 100%;
}
.res_tb01 th, .res_tb01 td {
    padding: 10px;
    border: solid 1px #ccc;
    box-sizing: border-box;
}
.res_tb01 th {
    background: #aaa;
    color: #fff;
    width: 20%;
    white-space: nowrap;
    text-align: center;
}
.res_tb01 td {
    text-align: left;
    background-color: #fff;
}
@media screen and (max-width: 640px) {
    .res_tb01 table {
        width: 100%;
    }
    .res_tb01 th, .res_tb01 td {
        display: block;
        width: 100%;
        border-bottom: none;
    }
    .res_tb01 tr:last-child {
        border-bottom: solid 1px #ccc;
    }
}

/* 画像切り替え */
.switch_image {
    position: relative;
}

.switch_image img {
    transition: opacity 0.5s;
}
.switch_image:hover img:first-of-type {
    opacity: 0;
}
.switch_image img:last-of-type {
    position: absolute;
    top: 0px;
    left: 0px;
    opacity: 0;
}
.switch_image:hover img:last-of-type {
    opacity: 1;
}
/*--------------------------------------------------------------

# ブース一覧

--------------------------------------------------------------*/
/* -- ブースカード（フード） -- 
figure.booth_card02 {
    color: #fff;
    position: relative;
    overflow: hidden;
    margin: 0 0 30px;
    width: 100%;
    background-color: #fff;
    color: #333;
    text-align: left;
    font-size: 1em;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, .5);
    border-radius: 10px;
}
figure.booth_card02 * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
figure.booth_card02 img {
    max-width: 100%;
    vertical-align: top;
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
figure.booth_card02 figcaption {
    padding: 15px;
    position: relative;
}
figure.booth_card02 .utage_num {
    color: #fff;
    top: 0;
    left: 0;
    height: 75px;
    width: 35%;
    position: absolute;
    padding-top: 5px;
    text-align: center;
    border-radius: 0 0 10px 0;
    font-weight: 900;
}

figure.booth_card02 .utage_num span {
    line-height: 30px;
}
figure.booth_card02 .utage_num .kikan {
    font-size: .8em;
    color: #fff;
    text-align: center;
    background-color: rgba(255,255,255,.35);

    height:40px;
    width: 100%;
    border-top: 4px dotted #fff;
    border-radius: 0 0 10px 0;

}
figure.booth_card02 .utage_num i {
    color: #fff;
}
.booth_card02 .booth_category {
    border-radius: 5px 0 0 5px;
    color: #fff;
    font-size: 1em;
    height: 36px;
    width: 110px;
    padding: 6px 0;
    position: absolute;
    text-align: center;
    top: 55%;
    right: 0;
}

.bg_food {
    background-color: #cf000e;
}

.bg_event {
    background-color: #0368b8;
}

.bg_exhibition {
    background-color: #007b43;
}

figure.booth_card02 h3, figure.booth_card02 p {
    margin: 0;
    padding: 0;
}
figure.booth_card02 h3 {
    margin-bottom: 10px;
    display: inline-block;
    font-weight: 600;
    color: #333;
    text-transform: uppercase;
    border-bottom: 2px solid #cf000e;
    width: 100%;
    font-size: 1.4em;
}
figure.booth_card02 p {
    font-size: 0.8em;
    margin: 0 0 20px 0;
    line-height: 1.6em;
    width: 100%;
}
figure.booth_card02 button {
    border: none;
    padding: 10px 25px;
    width: 100%;
    background-color: #eee;
    font-weight: 800;
    color: #333;
    font-size: 1em;
}
figure.booth_card02 a {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    z-index: 1;
}
figure.booth_card02:hover img, figure.booth_card02.hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}
figure.booth_card02:hover button, figure.booth_card02.hover button {
    background-color: #ccc;
}

/* -- ブースカード02 -- */
/* -- ブースカード（フード） -- */
figure.booth_card02 {
    color: #fff;
    position: relative;
    overflow: visible;
    margin: 30px 0 60px;
    width: 100%;
    background-color: #fff;
    color: #333;
    text-align: left;
    font-size: 1em;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, .5);
    border-radius: 10px;
}
figure.booth_card02 * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
figure.booth_card02 img {
    max-width: 100%;
    vertical-align: top;
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
figure.booth_card02 figcaption {
    padding: 15px;
    position: relative;
    min-height: 135px;
}
figure.booth_card02 .utage_num {
    /* background-color: #cf000e; */
    /* color: #fff; */
    top: -60px;
    left: 0;
    height: 60px;
    width: 100%;
    position: absolute;
    padding-top: 5px;
    text-align: center;
    border-radius: 0 0 0 0;
    font-weight: 900;
    font-size: 1.25em;
}
figure.booth_card02 .utage_num span {
    line-height: 30px;
}
figure.booth_card02 .utage_num .utage_num_title {
    padding: .25em 1em;
    margin: 0;
    display: block;
    color: #333;
    background: #fff;
    text-decoration: none;
    font-weight: 700;
    font-size: 1em;
    text-align: center;
    text-decoration: none;
    transition: .3s;
}
figure.booth_card02 .utage_num .utage_num_title:before {
    content: "";
    display: inline-block;
    width: 60px;
    height: 60px;
    margin: -3px 5px 0 0;
    background: url("/assets/img/utage_logo02.svg") no-repeat;
    background-size: contain;
    background-position: left;
    vertical-align: middle;
}
figure.booth_card02 .utage_num .utage_num_title:hover {
    background-color: none;
}
figure.booth_card02 .utage_num .utage_num_title img {
    margin-top: -100px;
}
/*
figure.booth_card02 .utage_num .kikan {
    font-size: .8em;
    color: #fff;
    text-align: center;
    background-color: rgba(255,255,255,.35);

    height:40px;
    width: 100%;
    border-top: 4px dotted #fff;
    border-radius: 0 0 0 0;

}
*/
figure.booth_card02 .utage_num i {
    color: #fff;
}
.booth_card02 .booth_category {
    color: #fff;
    font-size: .8em;
    height: 30px;
    min-width: 50%;
    padding: 6px 0;
    position: absolute;
    text-align: center;
    bottom: 32%; /* 31% */
    right: 0;
    border-radius: 15px 0 0 15px;
}
.bg_food {
    background-color: #cf000e;
}
.bg_event {
    background-color: #0368b8;
}
.bg_exhibition {
    background-color: #007b43;
}
figure.booth_card02 h3, figure.booth_card02 p {
    margin: 0;
    padding: 0;
}
figure.booth_card02 h3 {
    margin: 28px 0 18px;
    display: inline-block;
    font-weight: 600;
    color: #333;
    border-bottom: 2px solid #cf000e;
    width: 100%;
    font-size: 1.15em;
	padding-bottom: 5px;
}
figure.booth_card02 p {
    font-size: 0.8em;
    margin: 0 0 20px 0;
    line-height: 1.6em;
    width: 100%;
}
figure.booth_card02 button {
    border: none;
    padding: 10px 25px;
    width: 100%;
    border: 4px solid #cf000e;
	background:
        linear-gradient(90deg, transparent 10%, #fff 10% 90%, transparent 90%),
        linear-gradient(45deg, #cf000e 25%, transparent 25%, transparent 75%, #cf000e 75%),
        linear-gradient(45deg, #cf000e 25%, #cd5237 25%, #cd5237 75%, #cf000e 75%);
    background-position: 0 0, 15px 15px;
    background-size: 100% 100%, 30px 30px, 30px 30px;
    font-weight: 900;
    color: #333;
    font-size: 1em;
}
figure.booth_card02 button.info_no_link {
	border: 4px solid #ccc;
	background:
        linear-gradient(90deg, transparent 10%, #fff 10% 90%, transparent 90%),
        linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%),
        linear-gradient(45deg, #ccc 25%, #eee 25%, #eee 75%, #ccc 75%);
    background-position: 0 0, 15px 15px;
    background-size: 100% 100%, 30px 30px, 30px 30px;
	filter: opacity(70%);
}
figure.booth_card02 a {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    z-index: 1;
}
/*
figure.booth_card02:hover img, figure.booth_card02.hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}
*/
figure.booth_card02:hover button, figure.booth_card02.hover button {
    opacity: .8;
}
.booth_card02 .yo_yoyaku {
    background-color: #007b43;
    top: 20px;
    color: #fff;
    left: 10px;
    min-height: 24px;
    min-width: 64px;
    position: absolute;
    text-align: center;
    font-size: .8em;
    font-weight: 700;
    border-radius: 5px;
    padding: 5px;
}
/* -- SVGタイトル -- */
.text {
    font-family: "BIZ UDPGothic", serif;
    font-size: 1em;
    font-weight: 900;
    color: #fff;
    margin: 0;
    padding: 0;
}
@media screen and (max-width: 1200px) {
    .booth_card02 .booth_category {
        bottom: 32.5%; /*20%*/
    }
}
@media screen and (max-width: 640px) {
    .booth_card02 .booth_category {
        bottom: 33.5%; /*33%*/
    }
	figure.booth_card02 h3 {
    	margin: 30px 0 18px;
		font-size: 95%;
	}
}
@media screen and (max-width: 380px) {
    .booth_card02 .booth_category {
        bottom: 33.5%; /*33%*/
    }
	figure.booth_card02 h3 {
    	margin: 30px 0 18px;
		font-size: 95%;
	}
}
/*--------------------------------------------------------------

# ブースフリーエリア（仮）

--------------------------------------------------------------*/
.booth_free_aria {
    padding: 1em;
    margin-bottom: 1em;
    /*border: 1px solid #ccc;*/
    border-radius: 10px;
}
/* -- 見出し（大） -- */
.booth_free_aria h2 {
    font-weight: 700;
    margin: 1em 0;
    padding-bottom: 0.7em;
    text-align: center;
    position: relative;
    color: #333;
    font-size: 1.5em;
}
.booth_free_aria h2::after {
    content: '';
    position: absolute;
    border-bottom: 10px dotted #cf000e;
    width: 50px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
/* -- 見出し（小） -- */
.booth_free_aria h3 {
    font-weight: bold;
    padding: 0.3em;
    margin-bottom: 1.3em;
    position: relative;
    font-size: 1.25em;
}
.booth_free_aria h3::after {
    content: '';
    background-size: 10px 10px;
    background-color: #eee;
    background-image: repeating-linear-gradient(-45deg, #ccc 0, #ccc 3px, #fff 0, #fff 50%);
    width: 100%;
    height: 7px;
    position: absolute;
    bottom: -5px;
    left: 0;
}
.booth_free_aria dl {}
.booth_free_aria dd {
    line-height: 1.3;
}
.booth_free_aria dt {
    font-size: 1.1em;
    font-style: italic;
}
/*--------------------------------------------------------------

# ブースフリーエリア（仮）展示

--------------------------------------------------------------*/
/* -- リンクカード（左右カラム）-- */
.link_card {
    position: relative;
    overflow: hidden;
    margin: 0;
    width: 100%;
    height: 70px;
    color: #333;
    text-align: left;
    font-size: .85em;
    background-color: #fff;
    border: 1px solid #666;
}
.link_card * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.45s ease;
    transition: all 0.45s ease;
}
.link_card img {
    position: absolute;
    vertical-align: middle;
    backface-visibility: hidden;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    object-fit: cover;
}
.link_card figcaption {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1;
    align-items: center;
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.link_card h3, .link_card h5 {
    margin: 0;
    opacity: 0;
    letter-spacing: 1px;
}
.link_card h3 {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    text-transform: uppercase;
    font-size: .8em;
    font-weight: bold;
}
.link_card h5 {
    font-weight: normal;
    font-style: italic;
    color: #888;
    font-size: .75em;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
}
.link_card a {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
}
/* -- テキストリンク(サポーティングパートナーE以下) -- */
.link_card p {
    padding-top: 5px;
    font-size: 1em;
}
.link_card:hover > p {
    color: #ccc;
}
.link_card:hover > img, .link_card.hover > img {
    opacity: 0.1;
}
.link_card:hover h3, .link_card.hover h3, .link_card:hover h5, .link_card.hover h5 {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
    text-decoration: none;
}
.link_card.gold {
    height: 105px;
}
.link_card.silver {
    height: 70px;
}
.link_card.blonze {
    min-height: 60px;
	padding: 10px 0;
	font-size: .8em;
	display: grid;
	place-items: center;
}
.link_card.blonze img {
    height: 100%;
}
.link_card.support {
    height: 30px;
}
.link_card.support img {
    height: 100%;
}
.link_card.support2 {
    height: 30px;
    width: 80%;
    margin: 0 10%;
}
.link_card.pr_video {
    height: 126px;
    border: 1px solid #dee2e6;
}
.line_t {
    border-top: 1px dotted #333;
}
.partner-notes {
    text-align: right;
    font-size: 10px;
}
/* -- 協賛バナー（リンク無し） -- */
.link_card_no-link {
    position: relative;
    overflow: hidden;
    margin: 0;
    width: 100%;
    height: 70px;
    color: #333;
    font-size: 1em;
    background-color: #fff;
    border: 1px solid #666;
}
.link_card_no-link.blonze {
    height: 40px;
}
.link_card_no-link p {
    padding-top: 5px;
    font-size: .7em;
}
.link_card_no-link img {
    height: 40px;
}
.link_card.free {
    height: 150px;
}
.link_card.free img {
    width: 100%;
    height: 100%;
}
@media only screen and (min-width: 1200px) {
    .link_card.free {
        max-height: 80px;
    }
}
@media only screen and (min-width: 320px) and (max-width: 928px) {
    .link_card.pr_video {
        height: 240px;
    }
    .support_box {
        display: flex;
        flex-wrap: wrap;
    }
    .link_card.support {
        height: 30px;
        /*      width: 46%;
        margin: 0 2%;*/
    }
    .link_card.free {
        max-height: 80px;
    }
}
@media (max-width: 928px) {
    .sp_half {
        width: 50%;
    }
}
/*--------------------------------------------------------------

# 関係者の方へページ

--------------------------------------------------------------*/
/* -- ログインボックス -- */
.login_box {
    position: relative;
    overflow: hidden;
    margin: 0;
    width: 100%;
    background-color: #fff;
    border-radius: 5px;
    border-top: 5px solid #cf000e;
    text-align: center;
    font-size: 1em;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.login_box *, .login_box *:before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.1s ease-out;
    transition: all 0.1s ease-out;
}
.login_box figcaption {
    padding: 12% 10% 14%;
}
.login_box svg {
    font-size: 2em;
    color: #fff;
    width: 90px;
    height: 90px;
    background-color: #cf000e;
    border-radius: 50%;
    padding: 10px;
    margin: 0 0 1em;
    text-align: center;
    display: inline-block;
}
.login_box h3 {
    font-size: 1.5em;
    font-weight: 900;
    line-height: 24px;
    margin: 10px 0;
}
.login_box p {
    font-size: 1em;
    font-weight: normal;
    margin: 0 0 20px;
}
.login_box .button {
    text-decoration: none;
    border: 1px solid #cf000e;
    border-radius: 5px;
    padding: 10px 10px;
    display: inline-block;
    position: relative;
    z-index: 1;
    width: 100%;
    color: #cf000e;
    font-weight: 900;
    letter-spacing: 2px;
}
.login_box .button:before {
    background-color: #cf000e;
    position: absolute;
    top: 100%;
    bottom: 0;
    left: 0;
    right: 0;
    content: '';
    z-index: -1;
    opacity: 0;
}
.login_box .button:hover {
    color: #fff;
}
.login_box .button:hover:before {
    top: 0;
    opacity: 1;
}
/*--------------------------------------------------------------

# パートナーページ

--------------------------------------------------------------*/

.link_card {
        position: relative;
        overflow: hidden;
        margin: 0;
        width: 100%;
        height: 70px;
        color: #333;
        text-align: left;
        font-size: 1em;
        background-color: #fff;
        border: 1px solid #666;
    }
    .link_card * {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transition: all 0.45s ease;
        transition: all 0.45s ease;
    }
    .link_card img {
        position: absolute;
        vertical-align: middle;
        backface-visibility: hidden;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        object-fit: cover;
    }
    .link_card figcaption {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1;
        align-items: center;
        bottom: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .link_card h3, .link_card h5 {
        margin: 0;
        opacity: 0;
        letter-spacing: 1px;
    }
    .link_card h3 {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        text-transform: uppercase;
        font-size: .8em;
        font-weight: bold;
    }
    .link_card h5 {
        font-weight: normal;
        font-style: italic;
        color: #888;
        font-size: .75em;
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
    }
    .link_card a {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 1;
    }
    /* -- テキストリンク(サポーティングパートナーE以下) -- */
    .link_card p {
        padding-top: 5px;
        font-size: .7em;
    }
    .link_card:hover > p {
        color: #fff;
    }
    .link_card:hover > img, .link_card.hover > img {
        opacity: 1;
    }
    .link_card:hover h3, .link_card.hover h3, .link_card:hover h5, .link_card.hover h5 {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 0;
        text-decoration: none;
    }
    .link_card.gold {
        height: 105px;
    }
    .link_card.silver {
        height: 70px;
    }
    .link_card.blonze {
        height: 40px;
    }
    .link_card.blonze img {
        height: 100%;
    }
    .link_card.support {
        height: 30px;
    }
    .link_card.support img {
        height: 100%;
    }
    .link_card.support2 {
        height: 30px;
        width: 80%;
        margin: 0 10%;
    }
/* -- パートナー企業文字 -- */
.partners_box_2w {
  background-color: #fff;
  border: 2px solid #ccc;
  color: #333;
  font-size: 1em;
  line-height: 1em;
  margin: 0 1% 1em;
  outline: none;
  padding: 16px 0px 0px;
  position: relative;
  text-transform: uppercase;
  font-weight: 700;
  width: 98%;
  white-space: nowrap;
}

.partners_box_2w:before,
.partners_box_2w:after {
  border-color: transparent;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
  border-style: solid;
  border-width: 0;
  content: "";
  height: 30px;
  position: absolute;
  width: 30px;
}

.partners_box_2w:before {
  border-color: #e50113;
  border-left-width: 4px;
  border-top-width: 4px;
  left: -2px;
  top: -2px;
}

.partners_box_2w:after {
  border-bottom-width: 4px;
  border-color: #0068b8;
  border-right-width: 4px;
  bottom: -2px;
  right: -2px;
}
/*
.partners_box:hover,
.partners_box.hover {
  background-color: #fff;
}

.partners_box:hover:before,
.partners_box.hover:before,
.partners_box:hover:after,
.partners_box.hover:after {
  height: 100%;
  width: 100%;
}
*/

/* -- 1週間パートナー -- */
.partners_box_1w {
  display: inline-block;
  position: relative;
  margin-bottom: 1em;
  padding: 1em 0 0em;
  text-decoration: none;
  transition: .4s;
  width: 100%;
  border: 1px solid #ccc;
  background-color: #fff;
}
.partners_box_1w:hover {
  color:#666;
}
.partners_box_1w:before, .partners_box_1w:after {
  position: absolute;
  top: 0;
  content:'';
  width: 8px;
  height: 100%;
  display: inline-block;
}
.partners_box_1w:before {
  border-left: solid 2px #e50113;
  border-top: solid 2px #e50113;
  border-bottom: solid 2px #e50113;
  top: -1px;
  left: -1px;
}
.partners_box_1w:after {
  content: '';
  border-top: solid 2px #0068b8;
  border-right: solid 2px #0068b8;
  border-bottom: solid 2px #0068b8;
  bottom: -1px;
  right: -1px;
}
/*
.partners_box_1w {
    padding: 1em .5em 0em;
    margin-bottom: 1em;
    position: relative;
    border: 8px solid #ccc;
    z-index: 0;
    background-color: #fff;
}
.partners_box_1w:before {
    content: '';
    display: block;
    position: absolute;
    top: -8px;
    left: -8px;
    width: 12px;
    height: 12px;
    z-index: 1;
}
*/

/* -- 映像ヴァーチャルパートナー -- */
.partners_box_movie {
    padding: 1em 0 0em;
    margin-bottom: 1em;
    /*
    background: linear-gradient(90deg, #e50113 0% 33%, #fff 33% 66%, #0068b8 66%);
    background-repeat: no-repeat;
    background-size: .4em 4em;
    background-position: left;
    */
    font-weight: bold;
    text-align: center;
    border: 1px solid #ccc;
}

/* -- A -- */
.partners_a:before {
    background-color: #cf000e;
}
.partners_a p {
    font-size: 1.7em;
}
/* -- B -- */
.partners_b:before {
    background-color: deepskyblue;
}
.partners_b p {
    font-size: 1.5em;
    white-space: nowrap;
}
/* -- C -- */
.partners_c:before {
    background-color: greenyellow;
}
.partners_c p {
    font-size: 1.25em;
    white-space: nowrap;
}
/* -- D -- */
.partners_d:before {
    background-color: orange;
}
.partners_d p {
    font-size: 1.1em;
    white-space: nowrap;
}
/* -- E -- */
.partners_e p {
    font-size: 1em;
    font-weight: 700;
    white-space: nowrap;
}
/* -- F -- */
.partners_f p {
    font-size: .85em;
    white-space: nowrap;
}
/* -- G -- */
.partners_g {
    padding: 0em .5em -.5em;
    border: 4px solid #ccc;
}
.partners_g:before {
    background-color: #666;
    top: -4px;
    left: -4px;
    width: 4px;
    height: 4px;
}
.partners_g p {
    font-size: .85em;
    white-space: nowrap;
}
@media (max-width: 928px) {
    .partners_b p {
        font-size: 1em;
    }
    .partners_c p {
        font-size: 1em;
    }
    .partners_d p {
        font-size: 1em;
    }
}

/*--------------------------------------------------------------

# 歌ページ

--------------------------------------------------------------*/
.audio-player {
    height: 50px;
    width: 100%;
    background: #444;
    box-shadow: 0 0 20px 0 rgba(0, 0, 0, .25);
    font-family: arial;
    color: #fff;
    font-size: 0.75em;
    overflow: hidden;
    display: grid;
    grid-template-rows: 6px auto;
}
.audio-player .timeline {
    background: white;
    width: 100%;
    position: relative;
    cursor: pointer;
    box-shadow: 0 2px 10px 0 #0008;
}
.audio-player .timeline .progress {
    background: coral;
    width: 0%;
    height: 100%;
    transition: 0.25s;
}
.audio-player .controls {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    padding: 0 20px;
}
.audio-player .controls > * {
    display: flex;
    justify-content: center;
    align-items: center;
}
.audio-player .controls .toggle-play.play {
    cursor: pointer;
    position: relative;
    left: 0;
    height: 0;
    width: 0;
    border: 7px solid #0000;
    border-left: 13px solid white;
}
.audio-player .controls .toggle-play.play:hover {
    transform: scale(1.1);
}
.audio-player .controls .toggle-play.pause {
    height: 15px;
    width: 20px;
    cursor: pointer;
    position: relative;
}
.audio-player .controls .toggle-play.pause:before {
    position: absolute;
    top: 0;
    left: 0px;
    background: white;
    content: "";
    height: 15px;
    width: 3px;
}
.audio-player .controls .toggle-play.pause:after {
    position: absolute;
    top: 0;
    right: 8px;
    background: white;
    content: "";
    height: 15px;
    width: 3px;
}
.audio-player .controls .toggle-play.pause:hover {
    transform: scale(1.1);
}
.audio-player .controls .time {
    display: flex;
}
.audio-player .controls .time > * {
    padding: 2px;
}
.audio-player .controls .volume-container {
    cursor: pointer;
    position: relative;
    z-index: 2;
}
.audio-player .controls .volume-container .volume-button {
    height: 26px;
    display: flex;
    align-items: center;
}
.audio-player .controls .volume-container .volume-button .volume {
    transform: scale(0.7);
}
.audio-player .controls .volume-container .volume-slider {
    position: absolute;
    left: -3px;
    top: 15px;
    z-index: -1;
    width: 0;
    height: 15px;
    background: white;
    box-shadow: 0 0 20px #000a;
    transition: 0.25s;
}
.audio-player .controls .volume-container .volume-slider .volume-percentage {
    background: coral;
    height: 100%;
    width: 75%;
}
.audio-player .controls .volume-container:hover .volume-slider {
    left: -123px;
    width: 120px;
}

/* -- 歌詞 -- */
p.lyrics {
    font-size: 1.1em;
    line-height: 2;
}
/* -- 歌詞コピー禁止 -- */
p.no-copy {
    user-select: none;
}

.lyrics_box {
    margin: 0;
    padding: 2em 1.5em;
    box-shadow: 0 0 0 10px #eee;
    border-style: solid solid;
    border-width: 5px;
    border-color: #e50113 #0068b8 #e50113 #0068b8;
    background-color: #fff;
}
/* -- アーティストネーム -- */
.artist_name {
    position: relative;
    padding-bottom: 50px;
    font-size: 2em;
    text-align: center;
}

.artist_name::before {
    content: attr(data-en);
    display: block;
    color: #cf000e;
    font-size: 20px;
    font-style: italic;
    text-transform: uppercase;
}

.artist_name::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%) rotate(30deg);
    width: 1px;
    height: 40px;
    background-color: #cf000e;
}

/*--------------------------------------------------------------

# SDGSについてページ

--------------------------------------------------------------*/
.figure-caption-icon-wrap{
  margin:0 auto;
  display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.figure-caption-icon-wrap > figure{
  position:relative;
}
.figure-caption-icon-wrap > figure > img,.figure-caption-icon-wrap > figure >amp-img{
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
  display:block;
}
.figure-caption-icon-wrap > figure > amp-img{
  max-width:800px;
}
.figure-caption-icon-wrap figure figcaption{
  display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    align-items: flex-start;
    position: absolute;
    font-size: 1em;
    font-weight: 700;
    line-height: 1.5;
  color:#333;
}
.figure-caption-icon-wrap .caption-icon-img{
   position: absolute;
}
.figure-caption-icon-wrap .img-caption-text{
  position:relative;
}
.figure-caption-icon-2{
  margin-bottom: 0;
}

.figure-caption-icon-2 > figure figcaption{
    left: 5%;
    top: calc(100% - 45px);
    width: 90%;
    min-height: 30px;
    padding: 15px 10px 25px 75px;
    border-radius: 0px;
    background-color: rgba(255, 255, 255, 0.7);
    box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.2);
}
 /* アイコン*/
.figure-caption-icon-2 > figure figcaption::before{
    position: absolute;
    content: "";
    top:-20px;
    left: -20px;
    display: block;
    width: 100px;
    height: 80px;
    background-image: url(/assets/img/sdgs/foopy_sdgs.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

/* -- コンテスト - */

.contest_info {
	opacity: 0;
	position: absolute;
	left: 12px;
	right: 12px;
	bottom: -100%;
	z-index: 3;
	transition: all ease-in-out 0.5s;
	background: color-mix(in srgb, var(--background-color), transparent 10%);
	padding: 15px;
}
.contest_info h4 {
	font-size: 18px;
	font-weight: 600;
	padding-right: 50px;
	color: #fff;
}
.contest_info p {
	color: color-mix(in srgb, var(--default-color), transparent 30%);
	font-size: .8em;
	margin-bottom: 0;
	padding-right: 50px;
}

/*--------------------------------------------------------------

# スケジュール（タイムライン）

--------------------------------------------------------------*/
.timeline_area {
    position: relative;
    z-index: 1;
}
.single-timeline-area {
    position: relative;
    z-index: 1;
    padding-left: 180px;
}
@media only screen and (max-width: 575px) {
    .single-timeline-area {
        padding-left: 100px;
    }
}
.single-timeline-area .timeline-date {
    position: absolute;
    width: 180px;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -ms-grid-row-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding-right: 60px;
}
@media only screen and (max-width: 575px) {
    .single-timeline-area .timeline-date {
        width: 100px;
    }
}
.single-timeline-area .timeline-date::after {
    position: absolute;
    width: 3px;
    height: 100%;
    content: "";
    background-color: #ebebeb;
    top: 0;
    right: 30px;
    z-index: 1;
}
.single-timeline-area .timeline-date::before {
    position: absolute;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background-color: #f1c40f;
    content: "";
    top: 50%;
    right: 26px;
    z-index: 5;
    margin-top: -5.5px;
}
.single-timeline-area .timeline-date p {
    margin-bottom: 0;
    color: #020710;
    font-size: 13px;
    text-transform: uppercase;
    font-weight: 500;
}
.single-timeline-area .single-timeline-content {
    position: relative;
    z-index: 1;
    padding: 30px 30px 25px;
    border-radius: 6px;
    margin-bottom: 15px;
    margin-top: 15px;
    -webkit-box-shadow: 0 0.25rem 1rem 0 rgba(47, 91, 234, 0.125);
    box-shadow: 0 0.25rem 1rem 0 rgba(47, 91, 234, 0.125);
    border: 1px solid #ebebeb;
}
@media only screen and (max-width: 575px) {
    .single-timeline-area .single-timeline-content {
        padding: 20px;
    }
}
.single-timeline-area .single-timeline-content .timeline-icon {
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms;
    width: 30px;
    height: 30px;
    background-color: #f1c40f;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 30px;
    flex: 0 0 30px;
    text-align: center;
    max-width: 30px;
    border-radius: 50%;
    margin-right: 15px;
}
.single-timeline-area .single-timeline-content .timeline-icon i {
    color: #ffffff;
    line-height: 30px;
}
.single-timeline-area .single-timeline-content .timeline-text h6 {
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms;
}
.single-timeline-area .single-timeline-content .timeline-text p {
    font-size: 13px;
    margin-bottom: 0;
}
.single-timeline-area .single-timeline-content:hover .timeline-icon,
.single-timeline-area .single-timeline-content:focus .timeline-icon {
    background-color: #020710;
}
.single-timeline-area .single-timeline-content:hover .timeline-text h6,
.single-timeline-area .single-timeline-content:focus .timeline-text h6 {
    color: #3f43fd;
}



