8月配布ページ -肝試し- - Event Page Archive

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

@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho&family=Yusei+Magic&display=swap');

body {
    background: url(★ここに背景画像のタグ#imgurl/～#を入れてね★) top center / cover fixed;
    color: #fff;
    font-size: 0.75em;
    line-height: 200%;
    letter-spacing: 2px;
    margin: 0;
}

a {
    color: #fafad6;
    background: #ccc;
    padding: 2px 5px;
    margin: 0 5px;
    text-decoration: none;
}

h1 {
    font-family: 'Shippori Mincho', serif;
    font-size: 1rem;
    margin: 1.5em 0 1em;
    padding: 1em;
    color: #a0d8ef;
}
h1 span { font-size: 1.7rem; position: relative; display: inline-block; padding: 1em; text-align: center; color: #fff } 
h1 span:before, h1 span:after { font-family: 'Font Awesome 5 Free'; font-weight: 400; line-height: 1; position: absolute; top: calc(50% - .5em); } 
h1 span:before { left: 0; content: '\f58a'; } 
h1 span:after { right: 0; content: '\f5c8'; }

h2 {
    font-family: 'Shippori Mincho', serif;
    color: #ff3842;
    font-size: 1.8rem;
    text-align: center;
}

h3 {
    font-family: 'Shippori Mincho', serif;
    font-size: 1rem;
}

.ma1 {
	border-bottom: 1px solid #1e50a2; /* 下線 */
	color: #1e50a2; /* 文字色 */
	padding: 10px 10px 10px 70px; /* 上・右・下・左の余白 */
	position: relative;
}
.ma1:before {
	background-color: #1e50a2; /* 円1の色 */
	border-radius: 50%;
	content: '';
	display: block;
	position: absolute;
	top: 0px;
	left: 10px;
	width: 25px; /* 円1の幅 */
	height: 25px; /* 円1の高さ */
	box-shadow: 25px 10px 0px #1e50a2, /* 円2の位置・色 */
			 3px 25px 0px #1e50a2; /* 円3の位置・色 */
}
.ma1:after {
	border: 4px solid #fff; /* 白抜き円 */
	border-radius: 50%;
	content: '';
	display: block;
	position: absolute;
	top: 13px;
	left: 21px;
	width: 15px; /* 白抜き円の幅 */
	height: 15px; /* 白抜き円の高さ */
}

.ma2 {
	border-bottom: 1px solid #ff6a88; /* 下線 */
	color: #ff6a88; /* 文字色 */
	padding: 10px 10px 10px 70px; /* 上・右・下・左の余白 */
	position: relative;
}
.ma2:before {
	background-color: #ff6a88; /* 円1の色 */
	border-radius: 50%;
	content: '';
	display: block;
	position: absolute;
	top: 0px;
	left: 10px;
	width: 25px; /* 円1の幅 */
	height: 25px; /* 円1の高さ */
	box-shadow: 25px 10px 0px #ff6a88, /* 円2の位置・色 */
			 3px 25px 0px #ff6a88; /* 円3の位置・色 */
}
.ma2:after {
	border: 4px solid #fff; /* 白抜き円 */
	border-radius: 50%;
	content: '';
	display: block;
	position: absolute;
	top: 13px;
	left: 21px;
	width: 15px; /* 白抜き円の幅 */
	height: 15px; /* 白抜き円の高さ */
}

.arrow {
    width: 15px;
    height: 15px;
    border: 1px solid;
    border-color: transparent transparent #fff #fff;
    transform: rotate(-45deg);
    margin: 20px auto;
}

.top {
    font-family: 'Yusei Magic', sans-serif;
    width: 80%;
    margin: 50px auto 20px;
    padding: 25px;
    background: rgba(0,0,0,.5);
    border: solid 1px #fff;
    box-shadow: 0 0 0 10px rgba(0,0,0,.5);
    text-align: center;
}

.top a,.ft span,.ft a {
    display: inline-block;
    background: none;
    border: solid 1px #fff;
    width: 80px;
    margin: 10px;
}

.top a:hover,.ft a:hover {
    background: rgba(0,0,0,.5);
}

.main{
    margin-top: 50px;
    background: rgba(0,0,0,.5);
}

.wrp {
    max-width:800px;
    margin:10px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content:space-around;
}

.sec {
    width: 80%;
    margin: 50px auto 20px;
    padding: 25px 25px 35px;
    position: relative;
    border:double 3px #fff;
}

.sec a {
    background: none;
}

.sec a:hover {
    text-shadow: 0px 0px 5px #fdeff2;
}

.mybox{
    width: 75%;
    margin: 50px auto 20px;
    padding: 25px 25px 35px;
    position: relative;
    color: #333333;
    font-family: 'Yusei Magic', sans-serif;
    font-size: 1.2em;
    text-align: center;
    background: #fff;
 	border: 1px solid #ccc;	/* 線の太さ・種類・色 */ 
	box-shadow:1px 1px 6px 0px #ccc; 
	padding: 50px 10px 10px 10px;	/* 内側の余白 上・右・下・左 */
 	position: relative; 
	z-index: -2 } 
.mybox:before{
 	background-image: -webkit-gradient(radial, 30% 30%, 0, 30% 30%, 10, from(#ccccff), to(#0000cd));	/* マップピンの色 */
 	border-radius: 50%; 	box-shadow: .5px .5px 4px 1px rgba(128, 128, 128, 0.5);
 	content: '';
 	display: block;
 	position: absolute;
 	top: 5px;
 	left: 50%;
 	width: 15px;
 	height: 15px;
 	z-index: 0;
 } 
.mybox:after{
 	background-image: linear-gradient(-80deg, transparent 47%, #333333 47%, #333333 52%, transparent 52%, transparent);
 	content: '';
 	position: absolute;
 	top: 15px;
 	left: 50%;
 	width: 10px;
 	height: 13px;
 	z-index: -1;
 }
</style>

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

<div class="top">
<h1><span>Let's 肝試し!</span><br>～花火もあるよ～</h1>
<div class="arrow"></div>
<span>2021 August event at Hanamaru-So</span>
</div>

<div class="mybox"><b>8月29日(日) スケジュール</b><br>
<p>19:45 玄関前集合！集まり次第移動します</p>
<p>20:00 全員で花火観賞</p>
<p>21:00 肝試し開始！<br>
ペア＆順番は下記参照。<br>
　21:00 ○○＆○○<br>
　21:10 ○○＆○○<br> 
　21:20 ○○＆○○<br>
　21:30 ○○＆○○<br> 
　21:40 ○○＆○○<br>
　21:50 ○○＆○○<br> 
</p>
<p>帰宅した人から解散！おつかれさまでした！</p><br></div>

<div class="main">
<div class="wrp">
<div class="sec">
<h2>Event</h2>
<div class="arrow"></div>
<p><h3><span class="ma1">花火鑑賞</span></h3><br>
丸井丘町の景色が綺麗な丘の上にお連れします！普段夜は立ち入り禁止の場所なので他に人は来ない特等席ですよ！特別に場所をお借りしました！
</p><br>
<p><h3><span class="ma2">肝試し</span></h3><br>
丘を下る遊歩道約20分、はなまる荘まで5分の約25分間の肝試しです。<br>
花火を観賞した丘の上からスタート！スタート地点には天宮が、ゴールのはなまる荘では吾妻が皆さんのお帰りをお待ちしてます。<br>
スタートから丘を下るまでは緊急時以外のスマホの使用は禁止！<br>
丘を下る道は緩やかな遊歩道となっているのでご安心ください。道の中間辺りにある神社に人数分の鈴を置いておくので一人ひとつ持ち帰ってくださいね。神社の前には35段の石段があるので足元には十分お気を付けて！遊歩道の途中では知り合いに協力してもらい様々な仕掛けを設置するのでどうぞお楽しみに！(石段の前後は危ないので仕掛けはありません)
</p>
</div>
<div class="sec">
<h2>PL向け案内</h2>
<div class="arrow"></div>
<p>設定の都合上、20:00～21:00の間はTL上でリアルタイムの会話とさせて頂きます(ロルは禁止)。ご自身の出発時間から20分間のみTLでの発言に制限をさせて頂きます。</p>
<p>エンカはDMまたは掲示板にて行って頂きます。<br>
管理人アカウントを含めGDMを作成、注意点をお送りしますのでご確認頂けましたらスタンプにて反応をお願いします。双方より反応を頂けましたら管理人アカウントは退室しますので、エンカを開始してください。<br>
もしも掲示板でのやり取りを希望の場合はスタンプではなくその旨お伝えください。</p>
</div>
</div>
</div>

↓背景画像はここから保存していいよー↓

↓ここから下は確認用★↓

Event

花火鑑賞

丸井丘町の景色が綺麗な丘の上にお連れします！普段夜は立ち入り禁止の場所なので他に人は来ない特等席ですよ！特別に場所をお借りしました！

肝試し

丘を下る遊歩道約20分、はなまる荘まで5分の約25分間の肝試しです。
花火を観賞した丘の上からスタート！スタート地点には天宮が、ゴールのはなまる荘では吾妻が皆さんのお帰りをお待ちしてます。
スタートから丘を下るまでは緊急時以外のスマホの使用は禁止！
丘を下る道は緩やかな遊歩道となっているのでご安心ください。道の中間辺りにある神社に人数分の鈴を置いておくので一人ひとつ持ち帰ってくださいね。神社の前には35段の石段があるので足元には十分お気を付けて！遊歩道の途中では知り合いに協力してもらい様々な仕掛けを設置するのでどうぞお楽しみに！(石段の前後は危ないので仕掛けはありません)

PL向け案内

設定の都合上、20:00～21:00の間はTL上でリアルタイムの会話とさせて頂きます(ロルは禁止)。ご自身の出発時間から20分間のみTLでの発言に制限をさせて頂きます。

エンカはDMまたは掲示板にて行って頂きます。
管理人アカウントを含めGDMを作成、注意点をお送りしますのでご確認頂けましたらスタンプにて反応をお願いします。双方より反応を頂けましたら管理人アカウントは退室しますので、エンカを開始してください。
もしも掲示板でのやり取りを希望の場合はスタンプではなくその旨お伝えください。

Let's 肝試し!
～花火もあるよ～

↓ここから下は確認用★↓

Let's 肝試し!
～花火もあるよ～

Event

花火鑑賞

肝試し

PL向け案内

Let's 肝試し!～花火もあるよ～

↓ここから下は確認用★↓

Let's 肝試し!～花火もあるよ～

Event

花火鑑賞

肝試し

PL向け案内

Let's 肝試し!
～花火もあるよ～

Let's 肝試し!
～花火もあるよ～