9月配布ページ -個人- - Event Page Archive

↓HEAD編集にコピペしてね↓

/*** The new CSS Reset - version 1.2.0 (last updated 23.7.2021) ***/
:where(:not(iframe,canvas,img,svg,video):not(svg*)){all:unset;display:revert}*,::after,::before{box-sizing:border-box}ol,ul{list-style:none}img{max-width:100%}table{border-collapse:collapse}textarea{white-space:revert}
/* ↑ここまでリセットCSS↑ */

body{
background:#8b4513 ; /* キャラのカラーコードを入れる */
color:#000000 ;
font-family: 'Noto Sans JP', sans-serif;
font-size: 0.8em;
line-height: 1.5;
}

.waku{
background:#fff ;
width:85%;
max-width:600px;
margin:15px auto;
border:1px solid #8b4513 ; /* キャラのカラーコードを入れる */
border-radius:30px;
}

header{
font-family: 'Kiwi Maru';
color:#8b4513 ; /* キャラのカラーコードを入れる */
text-align: center ;
margin: 30px auto 5px;
position: relative;
}

header:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -50px;
  width: 100%;
  height: 20px;
  background: -webkit-repeating-linear-gradient(-45deg, #8b4513, #8b4513 2px, #fff 2px, #fff 4px); /* キャラのカラーコードを入れる */
  background: repeating-linear-gradient(-45deg, #8b4513, #8b4513 2px, #fff 2px, #fff 4px); /* キャラのカラーコードを入れる */
}

h1{
line-height:2 ;
}

.image{
height:100px;
width:100px;
position: relative;
margin: auto;
}
.image::before,
.image::after {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	border-style: solid;
}

.image::before {
	top: -5px;
	right: -5px;
	border-width: 0 20px 20px 0;
	border-color: transparent #8b4513 transparent transparent; /* キャラのカラーコードを入れる */
}

.image::after {
	bottom: -5px;
	left: -5px;
	border-width: 20px 0 0 20px;
	border-color: transparent transparent transparent #8b4513; /* キャラのカラーコードを入れる */
}

.main{
max-width:600px;
margin:2em auto;
padding:4em 2em 2em;
}

section{ margin: 1.5em 0; }
p{ margin: 1.2em 0; }

/* ここから吹出し */

/* 桜川 富美子 */
.fumiko{
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #ffa500;
  border-radius: 10px;
}

.fumiko::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #ffa500;
  border-bottom: 20px solid #ffa500;
}

/* 圷 清彦 */
.kiyohiko{
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #48d1cc;
  border-radius: 10px;
}

.kiyohiko::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #48d1cc;
  border-bottom: 20px solid #48d1cc;
}

/* 小沢 ほの香 */
.honoka{
  color: #fcfcfc;
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #9b72b0;
  border-radius: 10px;
}

.honoka::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #9b72b0;
  border-bottom: 20px solid #9b72b0;
}

/* 一色 真宵 */
.mayoi{
  color: #fcfcfc;
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #8b4513;
  border-radius: 10px;
}

.mayoi::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #8b4513;
  border-bottom: 20px solid #8b4513;
}

/* 相川 小雪 */
.sayuki{
  color: #fcfcfc;
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #a58f86;
  border-radius: 10px;
}

.sayuki::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #a58f86;
  border-bottom: 20px solid #a58f86;
}

/* 門脇 遊楽 */
.yura{
  color: #fcfcfc;
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #4169e1;
  border-radius: 10px;
}

.yura::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #4169e1;
  border-bottom: 20px solid #4169e1;
}

/* 丹川 海 */
.umi{
  color: #fcfcfc;
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #8b008b;
  border-radius: 10px;
}

.umi::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #8b008b;
  border-bottom: 20px solid #8b008b;
}

/* 祭田 幸太郎 */
.kohtarou{
  color: #fcfcfc;
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #191970;
  border-radius: 10px;
}
.kohtarou::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #191970;
  border-bottom: 20px solid #191970;
}

/* 住野 遥 */
.haruka{
  color: #fcfcfc;
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #5383c3;
  border-radius: 10px;
}
.haruka::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #5383c3;
  border-bottom: 20px solid #5383c3;
}

/* 葉山 陸 */
.riku{
  color: #fcfcfc;
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #d2691e;
  border-radius: 10px;
}

.riku::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #d2691e;
  border-bottom: 20px solid #d2691e;
}

/* 瀬名 真綾 */
.maaya{
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #ee827c;
  border-radius: 10px;
}

.maaya::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #ee827c;
  border-bottom: 20px solid #ee827c;
}

/* 都司 旭 */
.asahi{
  color: #fcfcfc;
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #008b8b;
  border-radius: 10px;
}

.asahi::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #008b8b;
  border-bottom: 20px solid #008b8b;
}

/* 常葉 存 */
.nagara{
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #48d16a;
  border-radius: 10px;
}

.nagara::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #48d16a;
  border-bottom: 20px solid #48d16a;
}

/* 葉室 善晴 */
.yoshiharu{
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #93ca76;
  border-radius: 10px;
}

.yoshiharu::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #93ca76;
  border-bottom: 20px solid #93ca76;
}

/* 和 瑞希 */
.mizuki{
  color: #fcfcfc;
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #b13546;
  border-radius: 10px;
}

.mizuki::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #b13546;
  border-bottom: 20px solid #b13546;
}

/* 墨石 竜 */
.ryo{
  color: #fcfcfc;
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #2e2930;
  border-radius: 10px;
}

.ryo::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #2e2930;
  border-bottom: 20px solid #2e2930;
}

/* 千代田 宏平 */
.kouhei{
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #ffdc50;
  border-radius: 10px;
}

.kouhei::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #ffdc50;
  border-bottom: 20px solid #ffdc50;
}

/* 春日 紫音 */
.shion{
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #bcbcff;
  border-radius: 10px;
}

.shion::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #bcbcff;
  border-bottom: 20px solid #bcbcff;
}

/* 浅井 奏音 */
.kanon{
  color: #fcfcfc;
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #af0082;
  border-radius: 10px;
}

.kanon::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #af0082;
  border-bottom: 20px solid #af0082;
}

/* 吾妻 晴臣 */
.aduma{
  color: #fcfcfc;
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #000000;
  border-radius: 10px;
}

.aduma::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #000000;
  border-bottom: 20px solid #000000;
}

/* 天宮 夏生 */
.amamiya{
  position: relative;
  margin: 1.2em;
  padding: 20px;
  background-color: #d3d3d3;
  border-radius: 10px;
}

.amamiya::before{
  right: 20px;
  bottom: -15px;
  border-right: 20px solid #d3d3d3;
  border-bottom: 20px solid #d3d3d3;
}

/* 共通部分まとめ */

.fumiko::before,.fumiko::after,
.kiyohiko::before,.kiyohiko::after,
.honoka::before,.honoka::after,
.mayoi::before,.mayoi::after,
.sayuki::before,.sayuki::after,
.yura::before,.yura::after,
.umi::before,.umi::after,
.kohtarou::before,.kohtarou::after,
.haruka::before,.haruka::after,
.riku::before,.riku::after,
.maaya::before,.maaya::after,
.asahi::before,.asahi::after,
.nagara::before,.nagara::after,
.yoshiharu::before,.yoshiharu::after,
.mizuki::before,.mizuki::after,
.ryo::before,.ryo::after,
.kouhei::before,.kouhei::after,
.shion::before,.shion::after,
.kanon::before,.kanon::after,
.aduma::before,.aduma::after,
.amamiya::before,.amamiya::after
{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-radius: 50%;
  transform: rotate(45deg);
  border-left: 20px solid transparent;
  border-top: 20px solid transparent;
}

.fumiko::after,
.kiyohiko::after,
.honoka::after,
.mayoi::after,
.sayuki::after,
.yura::after,
.umi::after,
.kohtarou::after,
.haruka::after,
.riku::after,
.maaya::after,
.asahi::after,
.nagara::after,
.yoshiharu::after,
.mizuki::after,
.ryo::after,
.kouhei::after,
.shion::after,
.kanon::after,
.aduma::after,
.amamiya::after
{
  right: 35px;
  bottom: -20px;
  border-right: 20px solid #fff;
  border-bottom: 20px solid #fff;
}
</style>

↓ページ編集にコピペしてね↓

桜川富美子さん

圷清彦さん

小沢ほの香さん

一色真宵さん

相川小雪さん

門脇遊楽さん

丹川海さん

祭田幸太郎さん

住野遥さん

葉山陸さん

瀬名真綾さん

都司旭さん

常葉存さん

葉室善晴さん

和瑞希さん

墨石竜さん

千代田宏平さん

春日紫音さん

浅井奏音さん

吾妻晴臣さん

天宮夏生さん