@charset 'utf-8';

/*↓20周年ロゴ↓*/
figure { padding:8px 24px;}
figure >* { padding:8px;}
figure img { max-width:608px; width:100%;}
figure figcaption { font-size:14px; text-shadow:0 1px 1px rgb(0 0 0 / 25%); line-height:1.5;}
@media screen and ( max-width:768px ){
figure { padding:8px;}
}
/*↑20周年ロゴ↑*/

/*↓セクション冒頭の説明↓*/
section > h4 {
font-size:14px; text-shadow:0 1px 2px #699;
padding:8px;
}
@media screen and ( max-width:768px ){
section > h4 { font-size:12px;}
}
/*↑セクション冒頭の説明↑*/

/*↓挨拶↓*/
.greeting { padding:16px 32px;}
.greeting div {
position:relative;
overflow:hidden;
background:radial-gradient(circle at 50% 32px, #689, #23404F, #161923 384px, #0C0F19 512px, #161923 768px);
border:4px solid; border-color:#BCC #899 #566; border-radius:16px;
box-shadow:0 0 4px #0C0F19 inset, 0 2px 8px rgb(0 0 0 / 50%);
color:#FFF; text-shadow:0 1px 1px #233;
padding:30px;
}
.greeting div:before {
position:absolute; left:calc(50% - 128px); top:calc(50% - 128px);
width:256px; height:256px;
background:url( ../img/d4e_2.png ) no-repeat center center / 240px auto;
opacity:0.25;
content:'';
}
.greeting div > * { position:relative;}
.greeting div > :nth-child(n+2) { margin-top:16px;}
.greeting h2 { font-size:16px; color:#FE6;}
.greeting p  { font-size:14px; line-height:1.75;}
.greeting h3 { font-size:12px; line-height:1.25;}
@media screen and ( max-width:768px ){
.greeting { padding:16px;}
.greeting div { padding:14px;}
}
/*↑挨拶↑*/
/*↓祝辞↓*/
.congrats { padding:8px 24px;}
.congrats > div {
color:#FFF; text-shadow:0 1px 1px #233;
padding:8px;
}
.congrats > div div {
display:block;
background:radial-gradient(circle at 50% 0, #F30, #900 256px, #600 512px, #900 768px);
border:4px solid; border-color:#DB0 #B80 #860; border-radius:16px;
box-shadow:0 0 4px #300 inset, 0 2px 8px rgb(0 0 0 / 50%);
padding:28px;
}
.congrats > div:nth-of-type(1) { display:none;}/* 項目列を非表示 */
.congrats p { color:#FFF; font-size:14px; line-height:1.75;}
.congrats p a { color:#FC0;}
.congrats h2 { color:#FD9; font-size:14px; margin-top:16px;}
.congrats h2:empty + h3 { margin-top:16px;}
.congrats h3 { color:#FEC; font-size:12px; margin-top:8px;}
.congrats h3:after { content:'\3000\69d8';}/* (全角空白)様 */
.congrats h2:empty,
.congrats h3:empty { display:none;}
.congrats .go-maker {
display:inline-block;
background:linear-gradient(#F91,#E62);
border:solid 2px; border-color:#C91 #962 #633;
box-shadow:0 2px 3px rgb(0 0 0 / 50%);
color:#FFF; font-size:12px; text-decoration:none;
padding:8px 1em; margin:-16px 16px 0;
}
@media screen and ( max-width:768px ){
.congrats { padding:8px;}
.congrats > div div { padding:12px;}
}
/*↑祝辞↑*/