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

	0. WPネイティブ設定
	
=======================================*/

/* editor */
 
p {
    display: block;
    margin: 1em 0;
}
strong { font-weight: bold; }
em { font-style: italic; }
blockquote {
    display: block;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 40px;
    -webkit-margin-end: 40px;
}
 
/* img */
 
.aligncenter {
    display: block;
    margin: 0 auto;
}
.alignright { float: right; }
.alignleft { float: left; }
 
img[class*="wp-image-"],
img[class*="attachment-"] {
    height: auto;
    max-width: 100%;
}
 
/* clearfix */
 
.clearfix {
    overflow: hidden;
    zoom: 1;
}
.clearfix:after {
    content: "";
    display: block;
    clear: both;
}

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

	1. フォント設定
	
=======================================*/

p,
pre,
cite,
blockquote {
font-size: 100%;
}

li,dt,dd {
font-size: 100%;
}

* {
font-style: normal;
}

strong {
font-weight:bold;
}


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

	2. サイト構造
	
=======================================*/

html {
box-sizing: border-box;
}

*, *:before, *:after {
box-sizing: inherit;
}

body {
margin: 0 auto;
padding: 0;
color: #754c24;
background-color: #e43d3b;
line-height: 1.6;
font-family: "Kiwi Maru","メイリオ",Meiryo,"ＭＳ ゴシック",sans-serif;
font-style: normal;
}

.kiwi-maru-regular {
  font-family: "Kiwi Maru", serif;
  font-weight: 400;
  font-style: normal;
}

br.clear {
clear: both;
font: 0pt/0pt sans-serif;
}

a {
color: #009de1;
text-decoration: none;
}

a:hover {
color: #009de1;
}

section {
clear: both;
}


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

	3. ヘッダ設定
	
=======================================*/




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

	3. メニュー設定
	
=======================================*/

#drawer {
display: none;
}

.drawer-nav {
display: none;
}

#sp-menu-button {
display: none;
}


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

	3. アニメーション共通
	
=======================================*/

.animate-fade-in {
  opacity: 0;
  transform: translateY(80px);
  transition: opacity 1.04s ease, transform 1.04s ease;
}

.animate-fade-in-down {
  opacity: 0;
  transform: translateY(-80px);
  transition: opacity 1.04s ease, transform 1.04s ease;
}

.animate-slide-in-left {
  opacity: 0;
  transform: translateX(-100px);
  transition: opacity 1.04s ease, transform 1.04s ease;
}

.animate-slide-in-right {
  opacity: 0;
  transform: translateX(100px);
  transition: opacity 1.04s ease, transform 1.04s ease;
}

.animate-zoom-in {
  opacity: 0;
  transform: scale(0.5);
  transition: opacity 1.04s ease, transform 1.04s ease;
}

.animate-zoom-out {
  opacity: 0;
  transform: scale(1.5);
  transition: opacity 1.04s ease, transform 1.04s ease;
}

.animated {
  opacity: 1 !important;
  transform: translate(0, 0) scale(1) !important;
}


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

	4. TOP設定
	
=======================================*/

/* --- メイン画像 ---*/

h1 {
margin: 0;
padding: 20px 20px 0 20px;
}

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


/* --- ngt ---*/

.ngt {
margin: -50px auto 0px auto;
max-width: 1110px;
}

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

.ngt video {
margin: 0 auto 0 auto;
width: 1000px;
height: auto;
display: block;
}


/* --- free ---*/

.free {
padding: 200px 0 115px 0;
text-align: center;
background-image: url("img/free-bg1.png"), url("img/free-bg2.png");
background-repeat: no-repeat, no-repeat;
background-position: top left,top right;
}

.free h1 {
margin: 50px 0 0 0;
padding: 0;
font-family: "sicunsui", sans-serif;
font-weight: 400;
font-style: normal;
color: #FFF;
font-size: 60px;
}

.free p {
margin: 0;
padding: 30px 0;
font-family: "noto-sans", sans-serif;
font-weight: 900;
font-style: normal;
color: #FFF;
font-size: 30px;
}

.free p br {
display: none;
}

.free h2 {
margin: 0 auto;
padding: 20px 0;
font-family: "noto-sans", sans-serif;
font-weight: 900;
font-style: normal;
color: #FFF;
background-color: #1d2087;
border: 4px solid #FFF;
width: 1000px;
font-size: 50px;
}


/* --- ramen ---*/

.ramen {
margin: 0 auto;
width: 1000px;
}

.ramen ul {
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
}

.ramen ul li {
list-style: none;
text-align: center;
font-family: "noto-sans", sans-serif;
font-weight: 900;
font-style: normal;
color: #FFF;
width: 485px;
}

.ramen ul li .ramen01 {
background-image: url("img/ramen01.jpg");
background-size: cover;
}

.ramen ul li .ramen02 {
background-image: url("img/ramen02.jpg");
background-size: cover;
}

.ramen ul li .ramen03 {
background-image: url("img/ramen03.jpg");
background-size: cover;
}

.ramen ul li .ramen04 {
background-image: url("img/ramen04.jpg");
background-size: cover;
}

.ramen ul li .ramen05 {
background-image: url("img/ramen05.jpg");
background-size: cover;
}

.ramen ul li .ramen06 {
background-image: url("img/ramen06.jpg");
background-size: cover;
}

.ramen ul li .ramen07 {
background-image: url("img/ramen07.jpg");
background-size: cover;
}

.ramen ul li .ramen08 {
background-image: url("img/ramen08.jpg");
background-size: cover;
}

.ramen ul li .ramen09 {
background-image: url("img/ramen09.jpg");
background-size: cover;
}

.ramen ul li .ramen10 {
background-image: url("img/ramen10.jpg");
background-size: cover;
}

.ramen ul li img {
vertical-align: top;
}

.ramen ul li h2 {
margin: 34px 0 0 0;
padding: 0;
font-size: 50px;
}

.ramen ul li p {
margin: 0 0 88px 0;
padding: 0;
font-size: 25px;
line-height: 1;
vertical-align: middle;
}

.ramen ul li p img {
margin: 0 10px 0 0;
width: 25px;
height: auto;
vertical-align: middle;
}


/* --- campaign ---*/

.campaign {
margin: 0 auto 100px auto;
width: 1000px;
text-align: center;
}

.campaign h2 {
padding: 20px 0;
}

.campaign h2 img {
width: 100%;
height: auto;
}

.campaign p {
margin: 0;
padding: 0;
font-family: "noto-sans", sans-serif;
font-weight: 900;
font-style: normal;
color: #FFF;
font-size: 44px;
line-height: 1.6em;
}


/* --- present ---*/

.present {
margin: 0 auto 100px auto;
width: 1000px;
background-color: #FFF;
border: 5px solid #1d2088;
}

.present-header {
padding: 50px 0;
background-color: #1d2088;
width: 100%;
color: #FFF;
text-align: center;
}

.present h1 {
margin: 0;
padding: 0;
font-family: "noto-sans", sans-serif;
font-weight: 900;
font-style: normal;
font-size: 40px;
}

.present h1 br {
display: none;
}

.present p {
margin: 0;
padding: 0;
font-family: "noto-sans", sans-serif;
font-weight: 700;
font-style: normal;
font-size: 30px;
}

.present h2 {
text-align: center;
font-family: "sicunsui", sans-serif;
font-weight: 400;
font-style: normal;
font-size: 40px;
color: #1d2088;
}

.present ul {
margin: 0;
padding: 0 60px 60px 60px;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}

.present ul li {
margin: 0;
padding: 50px 0;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
list-style: none;
position: relative;
}

.present ul li::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 10px; /* ← 画像の高さに合わせる */
background: url("img/present-line01.svg") no-repeat center / 100% 100%;
pointer-events: none;
}

.present ul li:last-child::after {
display: none;
}

.present ul li h3 {
font-family: "noto-sans", sans-serif;
font-weight: 900;
font-style: normal;
color: #e73736;
font-size: 38px;
width: 350px;
}

.present ul li img {
width: 520px;
height: auto;
}

.present ul li.half {
margin: 0;
padding: 0 20px;
list-style: none;
position: relative;
width: 50%;
}

.present ul li.half::before {
content: "";
position: absolute;
right: 0;
bottom: 0;
width: 11px; /* ← 画像の幅に合わせる */
height: 100%;
background: url("img/present-line04.svg") no-repeat center / 100% 100%;
pointer-events: none;
}

.present ul li.half::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 10px; /* ← 画像の高さに合わせる */
background: url("img/present-line02.svg") no-repeat center / 100% 100%;
pointer-events: none;
}

.present ul li.half h3 {
font-family: "noto-sans", sans-serif;
font-weight: 900;
font-style: normal;
color: #e73736;
font-size: 26px;
}

.present ul li.half img {
margin: 0 0 30px 0;
width: 90%;
height: auto;
}

.present ul li.half:nth-child(even)::before {
display: none;
}


/* --- sponsor ---*/

.sponsor {
margin: 0;
padding: 100px 0;
background-color: #FFF;
}

.sponsor h2 {
margin: 0 auto;
padding: 30px 0;
width: 1000px;
text-align: center;
font-family: "noto-sans", sans-serif;
font-weight: 900;
font-style: normal;
color: #1d2087;
font-size: 36px;
border-bottom: 3px solid #1d2087;
border-top: 3px solid #1d2087;
}

.sponsor ul {
margin: 90px auto 0 auto;
padding: 0;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
width: 660px;
}

.sponsor ul li {
list-style: none;
}

.sponsor ul li img {
width: 296px;
height: auto;
}



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

	5. FOOTER設定
	
=======================================*/

footer {
margin: 0;
}

footer .insta {
background-image: url("img/footer-bg.jpg");
background-size: cover;
background-position: center center;
}

footer .insta ul {
margin: 0 50px 0 50px;
padding: 200px 0 0 0;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
}

footer .insta ul li {
list-style: none;
}

footer .insta ul li img {
width: 100%;
height: auto;
vertical-align: bottom;
}

footer .insta ul li.day img {

}

footer .insta ul li.button img {
width: 500px;
height: auto;
}

footer .insta ul li.boy img {

}

.insta-button a {
margin: 20px 0 0 0;
padding: 10px;
display: block;
font-family: "noto-sans", sans-serif;
font-weight: 900;
font-style: normal;
background-color: #FFF;
text-decoration: none;
color: #1d2087;
font-size: 32px;
border-radius: 10px;
width: 480px;
text-align: center;
transition : all 0.5s ease 0s;
transition-timing-function: ease-out;
}

.insta-button a img {
width: 47px!important;
height: auto!important;
vertical-align: middle!important;
}

.insta-button a:hover {
background-color: #ced1ef;
border-radius: 10px;
}

footer .cr {
padding: 50px 0;
font-family: "noto-sans", sans-serif;
font-weight: 900;
font-style: normal;
font-size: 18px;
text-align: center;
background-color: #1d2087;
color: #FFF;
}


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

	5. wp-pagenavi設定
	
=======================================*/

/*---- wp-pagenavi ------*/

.wp-pagenavi {
margin: 0 auto 100px auto;
overflow: hidden;
text-align: center;
transition : all 0.2s ease 0s;
transition-timing-function: ease-out;
}

/*---- wp-pagenavi ページ「〇/〇」 ------*/
.wp-pagenavi .pages {
display: none;
}

/*---- wp-pagenavi ≪ 先頭 ------*/
.wp-pagenavi .first {
display: none;
}

/*---- wp-pagenavi ≪ ------*/
.wp-pagenavi a.previouspostslink {
margin: 0 5px;
padding: 10px;
display: inline-block;
width: 40px;
height: 40px;
line-height: 100%;
vertical-align: middle;
font-size: 15px;
border: 1px solid #007BFF;
border-radius: 40px;
background-color: #FFF;
color: #007BFF;
transition : all 0.2s ease 0s;
transition-timing-function: ease-out;
}

.wp-pagenavi a.previouspostslink:hover {
text-decoration: none;
border-radius: 40px;
background-color: #007BFF;
color: #FFF;
}

/*---- wp-pagenavi 省略「...」 ------*/
.wp-pagenavi .extend {
border: none;
}

/*---- wp-pagenavi 各ページ（リンクあり） ------*/
.wp-pagenavi a.page {
margin: 0 5px;
padding: 10px;
display: inline-block;
min-width: 40px;
height: 40px;
line-height: 100%;
vertical-align: middle;
font-size: 15px;
border: 1px solid #007BFF;
border-radius: 40px;
background-color: #FFF;
color: #007BFF;
transition : all 0.2s ease 0s;
transition-timing-function: ease-out;
}

.wp-pagenavi a.page:hover {
text-decoration: none;
border-radius: 40px;
background-color: #007BFF;
color: #FFF;
}

/*---- wp-pagenavi 現在のページ ------*/
.wp-pagenavi .current {
margin: 0 5px;
padding: 10px;
display: inline-block;
min-width: 40px;
height: 40px;
line-height: 100%;
vertical-align: middle;
font-size: 15px;
border: 1px solid #007BFF;
border-radius: 40px;
background-color: #007BFF;
color: #FFF;
}

/*---- wp-pagenavi 各ページ（現在のページより前のページ） ------*/
.wp-pagenavi .smaller {

}

/*---- wp-pagenavi 各ページ（現在のページより後のページ） ------*/
.wp-pagenavi .larger {

}

/*---- wp-pagenavi ≫ ------*/
.wp-pagenavi a.nextpostslink {
margin: 0 5px;
padding: 10px;
display: inline-block;
width: 40px;
height: 40px;
line-height: 100%;
vertical-align: middle;
font-size: 15px;
border: 1px solid #007BFF;
border-radius: 40px;
background-color: #FFF;
color: #007BFF;
transition : all 0.2s ease 0s;
transition-timing-function: ease-out;
}

.wp-pagenavi a.nextpostslink:hover {
text-decoration: none;
border-radius: 40px;
background-color: #007BFF;
color: #FFF;
}

/*---- wp-pagenavi 最後 ≫ ------*/
.wp-pagenavi .last {
display: none;
}