@charset "utf-8";

@font-face {
font-family: "Noto Sans JP";
src: url("/fonts/NotoSansJP-Regular.woff") format("woff");
font-weight: normal;
font-style: normal;
font-display: block;
}

@font-face {
font-family: "Noto Sans JP";
src: url("/fonts/NotoSansJP-Bold.woff") format("woff");
font-weight: bold;
font-style: normal;
font-display: block;
}


a:hover img {opacity: 0.8;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,input,p,blockquote,table,th,td,legend,em,strong{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img,abbr{border:0;}
address,caption,cite,pre,code,dfn,h1,h2,h3,h4,h5,h6,th,var,em{font-style:normal;font-weight:normal;}
strong{font-style:normal;font-weight:bold;}
caption,th {text-align:left;}
q::before,q::after{content:'';}
a{text-decoration:none;}
ul,ol {list-style-type:none;}

/* === common === */
/* html {visibility: hidden;} */
body {
font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "MS Pゴシック", "MS P Gothic", Osaka, sans-serif;
font-style: normal;
font-weight: 400;
margin: 0;
padding: 0;
background: #fff;
}
img {vertical-align: bottom;}
a {color:#002f86;}
a:link {text-decoration:underline;}
a:visited {text-decoration:underline; color:#8b5eab;}
a:hover, active {text-decoration: none; color:#0036ff; opacity: 0.6;}
body {
background-color:#fff;
font-size: 1.2rem;
line-height: 1.5;
/* font-feature-settings: "palt"; */
}
b, strong, em, h2, h3,
.seminar .company-name {
font-weight: 700;
}


a:hover img {opacity: 0.8;}

.ml10 {margin-left: 10px;}
.mr5 {margin-right: 5px;}

html {
scroll-padding-top: 64px;
}
.pc {
display: block;
}
.sp {
display: none;
}
h1 {
max-width: 1200px;
text-align: center;
padding-top: 40px;
margin: 0 auto 40px;
}
h1 img{
margin: auto;
width: min(100%, 1920px);
}

h2 {
font-size: 2rem;
letter-spacing: 5px;
margin-bottom: 40px;
text-align: center;
line-height: 1;
}
h2 span {
font-size: 20px;
letter-spacing: 5px;
font-weight: normal;
}
.japan {
width: 400px;
}
.btn {
display: flex;
justify-content: center;}

.btn a {
background-color: #000;
padding: 10px 40px;
border-radius:15px;
font-weight:bold;
color:#fff;
font-size: 24px;
text-decoration: none;
}
#lead {
width:100%;
max-width: 1000px;
margin: 0 auto 60px;
display: flex;
align-items: center;
}
#lead .leadTxt {
font-size: 24px;
margin-bottom: 40px;
}


/*==================================
    firstLoad
==================================*/
.firstLoad {
position: fixed;
inset: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
z-index: 99999;
background-color: #000000;
transition: all .5s ease-out
}

.firstLoad--loaded {
opacity: 0;
visibility: hidden;
}

.firstLoadTitle {
opacity: 0;
transform: translateY(50px);
margin-bottom: 30px;
width: 45%;
text-align: center;;
animation: 1.5s cubic-bezier(0,0,.37,.99) .5s topLoadingFade forwards
}
.firstLoadTitle img{
width: 100%;
margin-inline: auto;
}



@keyframes topLoadingFade {
	0% {
	opacity: 0;
	transform: translateY(50px)
	}
	to {
	opacity: 1;
	transform: translateY(0)
	}
}

/*==================================
    #mv
==================================*/
#mv {
position: relative;
margin: auto;
padding: 0;
width: 100%;
font-size: 0;
}
#slider{
position: relative;
margin-inline: auto;
width: min(100%, 1920px);
/*height: 75vw;*/
aspect-ratio: 420/315;
}
/* --- スライド画像 --- */
.sliderItem {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
z-index: 0;
/*transition: opacity 1s ease-in-out, z-index 1s step-end;*/
transition: opacity 0.5s linear;
overflow: hidden;
}
/* フェードアウト中のスライド */
.sliderItem.last-active {
opacity: 1;
z-index: 1; /* activeよりは下、通常よりは上 */
}
.sliderItem.active {
opacity: 1;
z-index: 2;/* 最前面 */
/*transition: opacity 1s ease-in-out, z-index 0s step-start;*/
transition: opacity 1s ease-in-out;
}

.sliderItem img{
width: 100%;
height: 100%;
aspect-ratio: 420/315;
object-fit: cover;
transform: scale(1);
/*transition: transform 6s linear;0423-*/
}
.sliderItem.active img,
.sliderItem.last-active img { 	
animation: zoomUp 7s linear forwards;
animation-play-state: paused;
}
#mv.loaded .sliderItem.active img,
#mv.loaded .sliderItem.last-active img {
animation-play-state: running;
}
@keyframes zoomUp {
	0% {
	transform: scale(1);
	}
	100% {
	transform: scale(1.15);
	}
}

#slider{
aspect-ratio: 128/72;
}
.sliderItem img{
aspect-ratio: 128/72;
}



/* --- 再生・停止ボタン --- */
.mvControlBtn {
position: absolute;
bottom: 18px;
right: 18px;
z-index: 10;
width: 24px;
aspect-ratio: 1/1;
border: none;
cursor: pointer;
background-color: transparent;
font-size: 0;
}
.mvControlBtn img{
width: 100%;
aspect-ratio: 1/1;
opacity: 1;
}
.mvControlBtn.play{
background: url(img/mv-control-btn_play.svg) no-repeat center center / 100%;
}
.mvControlBtn.play img{
opacity: 0;
}

/* --- photo_caption --- */
.mvPhotoCaption {
position: absolute;
bottom: 18px;
left: 18px;
z-index: 10;
border: none;
background-color: transparent;
font-size: 12px;
color: #fff;
/* text-shadow: 0px 0px 8px rgba(0, 0, 0, 1); */
text-shadow:1px 1px 0 #000, -1px -1px 0 #000,
-1px 1px 0 #000, 1px -1px 0 #000,
0px 1px 0 #000,  0-1px 0 #000,
-1px 0 0 #000, 1px 0 0 #000;
}

.mvControlBtn {
right: 23px;
width: 32px;
}


#categories {
background-color: #e5e2d9;
padding: 60px 40px;
}


#categories ul {
display: flex;
margin: auto;
justify-content: center;
}

#categories ul li {
background: #fff;
max-width: 640px;
padding: 10px;
position: relative;
width: calc((100% - 40px)/2);
box-shadow: 1px 1px 10px 0px rgba(0, 0, 0, 0.10);
}
#categories ul li img{
background: #fff;
width: 100%;
}

#categories ul li:first-of-type {
margin-right: 40px;
}

#categories ul li h3 {
margin: 0;
position: absolute;
top: 20px;
background: #fff;
padding: 10px 20px 10px 10px;
}

#categories ul li p {
margin: 10px;
font-size: 1rem;
}

#prize {
position: relative;
padding: 60px 40px;
background: url(img/prize_bg.webp) no-repeat 50%;
background-size: cover;
text-align: center;
background-attachment: fixed;
}

#prize h2 {
text-shadow:2px 2px 0 #FFF, -2px -2px 0 #FFF,
-2px 2px 0 #FFF, 2px -2px 0 #FFF,
0px 2px 0 #FFF,  0-2px 0 #FFF,
-2px 0 0 #FFF, 2px 0 0 #FFF;
}
#prize ul {
display: flex;
max-width: 1600px;
margin: auto;
}

#prize ul li {
background-color: #1a1a1a;
text-align: center;
padding: 10px;
margin-left: 20px;
width: calc((100% - 60px)/4);
color: #fff;
box-shadow: 1px 1px 10px 0px rgba(0, 0, 0, 0.10);
}
#prize ul li.prizeNissin {
min-width: 370px;
}

#prize ul li:first-of-type {
margin-left: 0;
}

.prize1st {
background: linear-gradient(45deg, #eacb4c 0%, #fff0bd 45%, #eacb4c 70%, #fff0bd 85%, #eacb4c 90% 100%);
background-size: 800% 400%;
animation: gradient 5s infinite cubic-bezier(.62, .28, .23, .99) both;
}
.prize2nd {
background: linear-gradient(45deg, #9e9e9e 0%, #e1e1e1 45%, #9e9e9e 70%, #e1e1e1 85%, #9e9e9e 90% 100%);
background-size: 800% 400%;
animation: gradient 5s infinite cubic-bezier(.62, .28, .23, .99) both;
}
.prize3rd {
background: linear-gradient(45deg, #a57e65 0%, #ffe4d2 45%, #a57e65 70%, #ffe4d2 85%, #a57e65 90% 100%);
background-size: 800% 400%;
animation: gradient 5s infinite cubic-bezier(.62, .28, .23, .99) both;
}
.prizeNissin {
background: linear-gradient(45deg, #ff0000 0%, #ffe2e2 45%, #ff0000 70%, #ffe2e2 85%, #ff0000 90% 100%);
background-size: 800% 400%;
animation: gradient 5s infinite cubic-bezier(.62, .28, .23, .99) both;
}
@keyframes gradient {
	0% {
	background-position: 0% 50%;
	}

	50% {
	background-position: 100% 50%;
	}

	100% {
	background-position: 0% 50%;
	}
}

.prize1st .prizeInner {
background-image: linear-gradient(180deg, #ffffff 60%, #fff6c4);
}
.prize2nd .prizeInner {
background-image: linear-gradient(180deg, #ffffff 60%, #dddddd);
}
.prize3rd .prizeInner {
background-image: linear-gradient(180deg, #ffffff 60%, #ffdeba);
}
.prizeNissin .prizeInner {
background-image: linear-gradient(180deg, #ffffff 60%, #ffdede);
}
.prizeInner {
display: flex; 
justify-content: center; 
height: 100%; align-items: center; 
background: #fff; 
color: #000; 
text-align: center;
padding: 20px 10px;
box-sizing: border-box;
flex-direction: column;
border: 1px solid #fff;
}

.prizeTitle {
display: flex;
justify-content: center;
align-items: center;
font-size: 40px;
font-weight: bold;
margin-bottom: 10px;
white-space: nowrap;
}
.prize1st .prizeTitle {
color:#ccac25;
}
.prize2nd .prizeTitle {
color:#999;
}
.prize3rd .prizeTitle {
color:#963;
}
.prizeNissin .prizeTitle {
color:#f33;
}
.prizeTitle img {
width: 45px;
margin-right: 5px;
}
.prizeDetail {
font-weight: bold;
font-size: 30px;
white-space: nowrap;
}
.prizeDetail span {
font-size: 24px;
margin: 0 5px;
}

.prizeDetailSmall {
font-weight: bold;
font-size: 20px;
white-space: nowrap;
}
.prizeDetailCaption {
font-size: 14.5px;
}

#requirement {
width:100%;
max-width: 1200px;
padding: 60px 40px;
margin: 0 auto;
}
#requirement p,
#requirement dl,
#requirement ul {
margin-left: 1rem;
}
#requirement h3 {
align-items:center;
display: flex;
column-gap: 10px;
margin-top: 40px;
margin-bottom: 10px;
font-size: 1.4rem;
}

#requirement h3:after {
background-color: #999;
content: "";
display: block;
flex: 1;
height: 1px
}

#requirement .schedule {
display: flex;
flex-wrap: wrap;
}

#requirement .schedule dt {
font-weight: bold;
width: 6rem;
flex-shrink: 0;
}

#requirement .schedule dd {
width: calc(100% - 6rem);
margin-bottom: 0.4em;
}

#requirement .conditions {
display: flex;
flex-wrap: wrap;
}
#requirement .conditions dt {
font-weight: bold;
width: 7rem;
flex-shrink: 0;
}

#requirement .conditions dd {
width: calc(100% - 7rem);
margin-bottom: 0.4em;
}

footer {
padding: 60px;
background-color: #1a1a1a;
text-align: center;
color: #fff;
}

footer a {
color: #fff;
}

footer a:hover {
color: #eee;
}

ul.ul>li {
list-style-type:disc;
line-height:1.4;
margin:0.4em 0 0.4em 1.5em;
}

ol.ol>li{
list-style-type: decimal;
margin:0.4em 0 0.4em 1.5em;
}



#back-top {
position: fixed;
bottom: 40px;
right:40px;
}
#back-top a {
width: 50px;
height: 50px;
display: block;
background: #1a1a1a;
color:#fff;
border-radius:6px;
text-align:center;
border:1px solid #fff;
}
#back-top a .fa{
line-height:50px;
font-size: 18px;
margin-right: 0;
}

.inquiry {
margin-bottom: 40px;
padding-bottom: 40px;
border-bottom: 1px solid #666;
}
.sponsorship {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 20px;
}

.sponsorship div {
display: flex;
align-items: center;
}
.sponsorship p {
margin-right: 15px;
font-size: 15px;
}
.sponsorship img {
width: 250px;
margin-right: 40px;
}



.is-fixed {
position: fixed;
top: 0;
left: 0;
z-index: 11;
width: 100%;
box-shadow: 0px 0px 5px #999999;
}

header {
width: 100%;
background-color: #fff;
z-index: 10;
}

.header__inner {
display: block;
z-index: 10;
position: relative;
max-width: 1200px;
height: 64px;
margin: auto;
z-index: 11;
}


/* ロゴ */
.header__logo {
height: 50px;
}
.header__hamburger {
z-index: 100;
position: absolute;
top: 0;
right: 0;
width: 70px;
height: 100%;
}

.header__hamburger {
display: none;
}


/* ナビゲーションメニュー */
.header__nav {
display: flex;
z-index: 10;
top: 0;
align-items: center;
width: 100%;
font-weight: 700;
margin-top: 64px;
position: static;
width: fit-content;
margin-top: 0;
}

.header__inner {
display: flex;
align-items: center;
justify-content: space-between;
height: inherit;
}


.nav__list {
display: flex;
width: 100%;
}

.nav__list li {
display: flex;
margin-left: 40px;
}
.nav__list a {
color: #000;
display: flex;
align-items: center;
height: 64px;
text-decoration: none;
}