/* 全力でダサくするためのスタイル */
@import url("https://fonts.googleapis.com/css2?family=DotGothic16&family=Dela+Gothic+One&display=swap");
*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:"ＭＳ Ｐゴシック","MS PGothic","Osaka","DotGothic16",sans-serif;font-size:15px;line-height:1.7;color:#000;
  background-color:#F8CD00;background-image:url(../img/pattern.png);background-size:200px auto;
}
a{color:#0000FF}a:hover{color:#FF00FF}
.wrap{max-width:420px;margin:0 auto;padding:0 0 24px;display:flex;flex-direction:column;gap:14px;text-align:center}
.wrap>*:not(.stripe):not(.bar){margin-left:10px;margin-right:10px}
.dela{font-family:"HGP創英角ﾎﾟｯﾌﾟ体","HG創英角ﾎﾟｯﾌﾟ体","HGPSoeiKakupoptai","HGSoeiKakupoptai","Dela Gothic One",sans-serif;font-weight:normal}
.stripe{height:18px;background:repeating-linear-gradient(45deg,#FFE600 0 14px,#3A2208 14px 28px)}
.stripe-box{background:repeating-linear-gradient(45deg,#FFE600 0 14px,#3A2208 14px 28px);padding:8px}
.kuso{color:#7B4A12}
.box{background:#fff;padding:10px 12px}
.ridge{border:6px ridge #7B4A12}
.groove{border:4px groove #7B4A12;background:#FFFDE0}
.dashed{border:4px dashed #7B4A12}
.left{text-align:left}
.head{background:#7B4A12;color:#FFE600;font-size:16px;padding:4px;text-align:center}
.head-red{background:#FF0000;color:#fff;font-size:16px;text-align:center}
.rainbow{background:linear-gradient(90deg,#F00,#F80,#FFE600,#0F0,#0CF,#00F,#F0F,#F00);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:rb 2s linear infinite}
@keyframes rb{to{background-position:200% 0}}
.outline{color:#FFE600;text-shadow:2px 2px 0 #7B4A12,-2px -2px 0 #7B4A12,2px -2px 0 #7B4A12,-2px 2px 0 #7B4A12,4px 4px 0 #000}
.bar{overflow:hidden;white-space:nowrap;padding:6px 0}
.bar.kuso-bar{background:#7B4A12;color:#FFE600;border-top:3px solid #FFE600;border-bottom:3px solid #FFE600;font-size:16px}
.bar.yellow-bar{background:#FFE600;color:#7B4A12;font-size:14px;padding:4px 0}
.mq{display:inline-block;animation:mq 10s linear infinite;padding-left:100%}
.mqr{display:inline-block;animation:mqr 12s linear infinite}
@keyframes mq{to{transform:translateX(-100%)}}
@keyframes mqr{from{transform:translateX(-100%)}to{transform:translateX(100vw)}}
.blink{animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.flash{animation:flash 1.5s steps(1) infinite;border:5px double #000;padding:10px}
@keyframes flash{0%{background:#FF00FF}33%{background:#00FF00}66%{background:#FFE600}}
.spin{display:inline-block;animation:spin 1.5s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.boing{animation:boing .8s ease-in-out infinite}
@keyframes boing{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(3deg) scale(1.06)}}
.menu a{display:block;padding:11px 12px;border-bottom:2px dashed #7B4A12;font-size:16px;text-align:left}
.menu a:last-child{border-bottom:0}
.plans{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.plan{border:5px outset #7B4A12;padding:10px 6px;display:flex;flex-direction:column;gap:4px}
.plan ul{margin:0;padding:4px;list-style:none;text-align:left;font-size:13px;line-height:1.6;background:#fff;color:#000}
.plan .btn{margin-top:auto}
.btn{display:block;padding:10px;text-decoration:none;font-size:16px;border:4px outset #ccc;background:#fff;color:#0000FF;cursor:pointer;text-align:center}
.btn-green{background:#00FF00;color:#000;border:5px outset #66FF66}
.btn-big{font-family:"HGP創英角ﾎﾟｯﾌﾟ体","HG創英角ﾎﾟｯﾌﾟ体","HGPSoeiKakupoptai","Dela Gothic One",sans-serif;font-size:22px;width:100%;min-height:56px}
.counter{background:#000;color:#00FF00;font-family:"Courier New",monospace;font-size:22px;padding:2px 10px;letter-spacing:4px;border:3px ridge #7B4A12;display:inline-block}
footer{background:#3A2208;color:#FFE600;font-size:12px;padding:8px}
footer{display:flex;flex-direction:column;gap:4px}
footer a{color:#00FFFF;font-size:15px}
footer .org{font-family:"Hiragino Kaku Gothic ProN","Meiryo","Yu Gothic",sans-serif;font-size:13px}
footer .org a{font-size:13px;color:#00FFFF}
footer a.litlink{display:block;margin-top:6px;padding:10px;background:#FF00FF;color:#FFE600;border:4px outset #FF77FF;font-size:14px;word-break:break-all;text-decoration:none}
.red{color:#FF0000}
/* フォーム */
form{background:#FFFDE0;border:5px outset #7B4A12;padding:12px;display:flex;flex-direction:column;gap:12px;text-align:left}
.field{display:flex;flex-direction:column;gap:4px}
.field label{font-size:15px;color:#7B4A12}
input[type=text],input[type=email],textarea{font:inherit;font-size:16px;padding:10px;border:3px inset #7B4A12;background:#fff;width:100%}
fieldset{margin:0;border:3px dashed #FF00FF;background:#fff;padding:8px 10px}
legend{color:#7B4A12;padding:0 4px}
.check{display:flex;gap:8px;align-items:center;min-height:44px;font-size:15px}
.check input{width:24px;height:24px;margin:0;flex:none}
.note{font-size:14px;background:#fff;border:3px dotted #FF0000;padding:8px}
.paid-note{display:none;font-size:14px;background:#FFE600;border:2px solid #7B4A12;padding:6px 8px}
.is-paid .paid-note{display:block}
.err{color:#FF0000;font-weight:bold}
@media (prefers-reduced-motion:reduce){*{animation:none!important}.stalker{display:none!important}}

/* bot対策の見えない欄 */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* ===== 2002年の個人ｻｲﾄ ===== */
.layout{width:calc(100% - 20px);border-collapse:collapse}
.layout,.layout tbody,.layout tr,.layout td{display:block}
.layout tr{display:flex;flex-direction:column;gap:14px}
.layout td{display:flex;flex-direction:column;gap:14px}
.layout td.side{order:2}
.small{font-size:12px;line-height:1.6}
.side-box{border:3px outset #ccc;padding:0 0 6px;display:flex;flex-direction:column;gap:6px;align-items:center}
.side-box .head{align-self:stretch}
.btn-mini{display:inline-block;font:inherit;font-size:14px;padding:4px 12px;border:3px outset #ccc;background:#E0E0E0;color:#000;cursor:pointer}
.btn-mini:active{border-style:inset}
.bnr{display:block;max-width:100%;height:auto;border:0}
.bnr-code{width:95%;font-family:monospace;font-size:11px;border:2px inset #ccc}
.link88{display:flex;flex-wrap:wrap;gap:4px;justify-content:center}
.link88 a{width:88px;height:31px;display:flex;align-items:center;justify-content:center;font-size:11px;line-height:1.1;text-decoration:none;color:#fff;background:#000080;border:2px outset #6666FF}
.link88 a:nth-child(2){background:#800000;border-color:#FF6666}
.link88 a:nth-child(3){background:#008000;border-color:#66FF66}
.link88 a:nth-child(4){background:#800080;border-color:#FF66FF}
.aa{align-self:center;font-family:"ＭＳ Ｐゴシック","MS PGothic","IPAMonaPGothic","Mona",monospace;font-size:12px;line-height:1.15;text-align:left;background:#fff;border:2px dashed #7B4A12;padding:6px;margin:0;overflow-x:auto}
.hr-dot{display:block;height:6px;margin:4px 0;background:radial-gradient(circle,#FF00FF 2px,transparent 2.5px) 0 0/10px 6px repeat-x}
hr.line{border:0;height:12px;margin:0;background:radial-gradient(circle,#FF0000 3px,transparent 3.5px) 0 0/16px 12px repeat-x,radial-gradient(circle,#0000FF 3px,transparent 3.5px) 8px 0/16px 12px repeat-x}
.stalker{position:fixed;left:0;top:0;pointer-events:none;z-index:9999;color:#FF00FF;font-size:14px;text-shadow:1px 1px 0 #FFE600;transition:transform .08s linear}

@media (max-width:899px){.pc-only{display:none!important}}
/* PCで見たら760px固定の2段組み（左ﾒﾆｭｰ） */
@media (min-width:900px){
  .wrap{max-width:780px;border-left:3px outset #7B4A12;border-right:3px outset #7B4A12;background:rgba(255,230,0,.35)}
  .layout{display:table;table-layout:fixed;border:3px outset #ccc;background:#C0C0C0}
  .layout tbody{display:table-row-group}
  .layout tr{display:table-row}
  .layout td{display:table-cell;vertical-align:top;padding:8px;border:2px inset #ccc}
  .layout td.side{width:232px;background:#FFFDE0}
  .sp-only{display:none!important}
  .layout td>*+*{margin-top:12px}
  .layout td.main{background:#FFE600}
  body{font-size:13px}
  .menu a{font-size:13px;padding:6px 8px}
}
.aa-pop{position:fixed;z-index:10000;border:3px outset #ccc;box-shadow:4px 4px 0 #3A2208;background:#FFFDE0;max-width:none}