@charset "UTF-8";

/* 基本色 */
:root {
	--main-color: #5D9AB2;
	--accent-color: #bf6aaf;
    --accent2-color: #ff0000;
	--dark-main-color: #2B5566;
	--text-bright-color: #ffffff;
    --text-h-color: #108EC1;
    --text-e-color: #4e4e4e;
	--icon-color: #fff;
	--icon-bk-color: #ddd;
	--gray-color: #ddd;
	--large-width: 1000px;
	--middle-width: 800px;
}


/* 基本設定： フォントサイズ */
@media (max-width: 599px) {
	:root {
		font-size: 14px;
	}
}

@media (min-width: 600px) and (max-width: 799px) {
	:root {
		font-size: 16px;
	}
}

@media (min-width: 800px) {
	:root {
		font-size: 17px;
	}
}

body {font-size: 16px;}



/* 基本設定： ページ全体 */
body {
	margin: 0;
	font-family: 'メイリオ',
		'Hiragino Kaku Gothic Pro', 
		sans-serif;
    /*background-color: rgb(255, 255, 0)*/
}








.hune {
	background-color: #1f1f1f;
	text-align: center;
}

.hune img.mainv {
	display: block;
	margin: 0 auto;
	width: 100%;
	max-width: 500px;
	height: auto;
}


.huneB {
	/*display: flex;
	align-items: center;
	justify-content: center;
	height: 53vh;
	min-height: 530px;*/
	color: #4e4e4e;
	color: var(text-e-color);
	text-align: center;

}





.huneC {
	/*display: flex;
	align-items: center;
	justify-content: center;
	height: 53vh;
	min-height: 530px;*/
	text-align: center;

background-position:center;
}


.hune > .container {
	margin-left: auto;
	margin-right: auto;
	padding: 20px 10px 0;
}

/* テキスト見出し（画像タイトルの代わり） */
.text-title {
	font-size: 1.5rem;
	color: #4e4e4e;
	margin: 2.5em 0 0.8em;
}

.text-title::after {
	content: "";
	display: block;
	width: 3em;
	height: 4px;
	margin: 0.4em auto 0;
	background: var(--accent2-color);
	border-radius: 2px;
}

/* プロローグ：レッド */
.huneB img.chara-red {
	max-width: 220px;
	width: 50%;
	padding: 0;
}

/* キャラクター横並び */
.chara-row {
	display: flex;
	justify-content: center;
	align-items: flex-end;
	gap: 10px;
	flex-wrap: wrap;
	margin: 1.5em 0;
}

.huneB .chara-row img {
	max-width: 15%;
	height: auto;
	padding: 0;
}

/* 参加方法 */
.huneB img.title.howto {
	max-width: 100%;
	width: 100%;
	padding: 0;
}

/* 配布場所・概要バッジ（高さを揃えて照準マークを同サイズに） */
.huneB img.badge,
.huneB .badge-row img {
	width: auto;
	height: auto;
	max-height: 185px;
	max-width: 100%;
	padding: 0;
}

.huneB img.badge {
	padding: 0.5em 0;
}

.badge-row {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	margin: 1em 0;
}


.huneA > .container {
	max-width: 600px;
	max-width: var(--middle-width);
	margin-left: auto;
	margin-right: auto;
	padding: 30px 10px;

}

.huneA p {
	font-size: 1rem;
    padding: 1rem;
	line-height: 2.4;
    color: var(--text-e-color);
color:  #4e4e4e;
}






.huneB > .container {
	max-width: 800px;
	max-width: var(--middle-width);
	margin-left: auto;
	margin-right: auto;
	padding: 30px 10px;

}



.huneC > .container {
	max-width: 450px;

	margin-left: auto;
	margin-right: auto;
	padding: 30px 10px;


}

.chui > .container {
	max-width: 800px;
	max-width: var(--middle-width);
	margin-left: auto;
	margin-right: auto;
	padding: 30px 10px;
	
}

.chui > .container p {
	color: #545454;
	font-size: 0.95rem;
	
}



.imgc {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

	.btn {
		display: inline-block;
		background: salmon; /* 背景色 */
		color: #fff; /* 文字色 */
		padding: 16px 40px; /* 上下の余白、左右の余白 */
		text-decoration: none; /* デフォルトで入るリンクの下線を消す */
		border-radius: 30px; /* 角を丸くする */
	  }






.huneB a, .huneC a,{
	display: inline;
	padding: 10px;
    color: var(--text-h-color);
    color:  #108EC1;
	text-decoration: none;
}


.hune h1 {
    color: var(--text-e-color);
    color:  #4e4e4e;
	font-size: 2rem;
}

.huneB h2 {
color: var(--text-e-color);
color:  #4e4e4e;
  position: relative;
  padding: 0 0 0 0;
  margin-bottom: 0;

}
.huneB h1 {
	color: var(--text-e-color);
	color:  #4e4e4e;
	  position: relative;
	  padding: 0 0 0 0;
	  font-size: 1.6rem;
	
	}





.huneC h2 {
color: var(--text-e-color);
  position:relative;
  padding: 4em 1em 0 0;

}


.huneB h3 {
color: var(--text-e-color);
color:  #4e4e4e;
font-size: 1.4rem;
  position: relative;
  padding: 0.6em;

}

.huneB img.title {

	max-width: 100%;
	display: block;
	margin-left: auto;
	margin-right: auto;

}


.huneB img.title {

	max-width: 500px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.chui img.title {

	max-width: 500px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}



.huneC img.title {

	max-width: 350px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}




.huneC h3 {

color:  #ffffff;
font-size: 1.4rem;
   padding: 0 0 0 1.25rem  ;
	line-height: 2;
    text-align: left;
	margin: 40px 0;

}






.huneB p {
	font-size: 1.1rem;
    padding: 0 0;
	line-height: 1.6;
    color: var(--text-e-color);
	font-weight: 500;
color:  #4e4e4e;
}



a {
	color: #545454;
	transition: 0.5s;
	text-decoration: none;
}
a:hover {
	color: #ffbbbb;
	text-decoration: none;
}






.huneC p  {
	font-size: 0.9rem;
    	padding-left: 1rem;
	line-height: 2;
color:  #000000;
    text-align: left;
}

p .c {text-align: center;}


.huneB img {
	max-width: 95%;
        padding: 1em 1em 1em 0  ; 
}


.huneB img.item {
	max-width: 40%;

}


p.indent-1 {

	padding-left: 2em;
}



.huneC img {
	max-width: 500px;
    text-align: left;
}




@media (min-width: 700px) {

.hune img.mainv {
	max-width: 560px;
}

.huneB img.item {
	max-width: 40%;
}

.huneC img.item {
	max-width: 70%;
}

.huneC img {
	max-width: 60%;
	padding: 2em 0 1em 0;
	text-align: center;
}

}