/* bodyにAppleシステムフォントを指定 */
body {-webkit-text-size-adjust: 100%; font-family:system-ui, -apple-system, BlinkMacSystemFont, sans-serif; font-size: 18px; font-weight: 350; line-height: 0px; padding:0; margin:0; letter-spacing:-0px; vertical-align:middle;}
h1 {font-size:54px; font-weight:150; line-height:54px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:36px; font-weight:300; line-height:36px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h3 {font-size:30px; font-weight:350; line-height:30px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h4 {font-size:24px; font-weight:500; line-height:30px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h5 {font-size:18px; font-weight:600; line-height:30px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h6 {font-size:18px; font-weight:600; line-height:30px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
/* 本文の行間高さ＝フォントサイズ*1.5〜2.0＝18*1.666＝30px */
p {font-size:18px; font-weight:350; line-height:30px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
a {text-decoration:none; color: #6666FF;}
.flex-wrap{padding: 0px 0px; display: flex; flex-wrap: wrap; justify-content: space-between;}
.flex-wrap-center{padding: 0px 0px; display: flex; flex-wrap: wrap; justify-content: center;}
.h120{height: 120px; padding: 0px 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center;}
.h105{height: 105px; padding: 0px 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center;}
.h1{height: 90px; padding: 0px 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center; vertical-align:middle;}
.h2{height: 90px; padding: 0px 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center;vertical-align:middle;}
.h3{height: 60px; padding: 0px 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center;vertical-align:middle;}
.h4{height: 60px; padding: 0px 0px; display: flex; flex-wrap: wrap; justify-content: flex-start; place-items: center; vertical-align:middle;}
.h90{height: 90px; padding: 0px 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center;}
.h75{height: 75px; padding: 0px 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center;}
.h60{height: 60px; padding: 0px 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center;}
.h30{height: 30px; padding: 0px 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center;}
.h15{height: 15px; padding: 0px 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center;}
p10 {font-family:"Helvetica Neue", "Hiragino Sans",sans-serif;font-size:10px;font-weight:400;line-height:0.5;padding:0;margin:0;}

p12 {font-family:"Helvetica Neue", "Hiragino Sans",sans-serif;font-size:12px;font-weight:400;line-height:27px;padding:0;margin:0;;vertical-align:middle;}

me18 {font-family: "Menlo"; white-space:pre; font-size: 17.95px; font-weight: 400; line-height: 1; padding:0; margin:0; vertical-align:middle;}

.waku{padding:0px 18px;}
.huti{border: 1px solid #C0C0C0;}

aka {color: #E07000;}

* スクロールバーを常時表示にすると100vwはうまく動作しません */
.page{width:100vw;}
#page00{width:100vw; background: #E8E8FF;}
#page01{width:100vw; background: #FFE8E8;}
#page02{width:100vw; background: #E8E8FF;}
#page03{width:100vw; background: #FFE8E8;}
#page04{width:100vw; background: #E8E8FF;}
#page05{width:100vw; background: #FFE8E8;}
#page06{width:100vw; background: #E8E8FF;}
#page07{width:100vw; background: #FFE8E8;}
#page08{width:100vw; background: #E8E8FF;}
#page09{width:100vw; background: #FFE8E8;}
#page10{width:100vw; background: #E8E8FF;}
#page11{width:100vw; background: #FFE8E8;}


/* (1366〜)×(969〜) Firefox */
@media screen and (min-width:1366px) and (min-height:969px)
{
.hako{width:200%; text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #F0F0F0; border: 1px solid #C0C0C0;}
}


/* (1366〜)×968 Safari向け */
@media screen and (min-width:1366px) and (min-height:968px) and (max-height:968px)
{
.hako{width:200%; text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #FFFFFF; border: 0px solid #C0C0C0;}
}


/* Firefox (1366〜)×968 */
@media screen and (min-width:1366px) and (min-height:939px) and (max-height:967px)
{
.hako{width:200%; text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #F0F0F0; border: 1px solid #C0C0C0;}
}


/* (1366〜)×938 Safari */
@media screen and (min-width:1366px) and (min-height:938px) and (max-height:938px)
{
.hako{width:200%; text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #FFFFFF; border: 0px solid #C0C0C0;}
}


/* Firefox (1366〜)×938 */
@media screen and (min-width:1366px) and (min-height:897px) and (max-height:937px)
{
.hako{width:200%; text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #F0F0F0; border: 1px solid #C0C0C0;}
}


/* (1366〜)×896 Safari */
@media screen and (min-width:1366px) and (min-height:896px) and (max-height:896px)
{
.hako{width:200%; text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #FFFFFF; border: 0px solid #C0C0C0;}
}


/* Firefox (1366〜)×(0〜895) */
@media screen and (min-width:1366px) and (max-height:895px)
{
.hako{width:200%; text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #F0F0F0; border: 1px solid #C0C0C0;}
}

/* Safari (1366〜)×(892) */
@media screen and (min-width:1366px) and (min-height:892px) and (max-height:892px)
{
.hako{width:200%; text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #FFFFFF; border: 0px solid #C0C0C0;}
}


/* Firefox (1025〜1365)×(0〜895) */
@media screen and (min-width:1025px) and (max-width:1365px) and (max-height:895px)
{
.hako{width:200%; text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #F0F0F0; border: 1px solid #C0C0C0;}
h1 {font-size:48px; font-weight:150; line-height:48px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:30px; font-weight:300; line-height:30px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* (1025〜1365)×(896〜) Safari */
@media screen and (min-width:1025px) and (max-width:1365px) and (min-height:896px)
{
.hako{width:200%; text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #FFFFFF; border: 0px solid #C0C0C0;}
h1 {font-size:48px; font-weight:150; line-height:48px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:30px; font-weight:300; line-height:30px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* Safari 1024×(1238〜) height>=1238 */
@media screen and (min-width:1024px) and (max-width:1024px) and (min-height:1238px)
{
.hako{width:200%; text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #FFFFFF; border: 0px solid #C0C0C0;}
h1 {font-size:48px; font-weight:150; line-height:48px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:30px; font-weight:300; line-height:30px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* Firefox 1024×(0〜1237) */
@media screen and (min-width:1024px) and (max-width:1024px) and (max-height:1237px)
{
.hako{width:200%; text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #F0F0F0; border: 1px solid #C0C0C0;}
h1 {font-size:48px; font-weight:150; line-height:48px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:30px; font-weight:300; line-height:30px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* Safari (682.667〜1023)×(896〜) */
@media screen and (min-width:682.667px) and ( max-width:1023px) and (min-height:896px)
{
.hako{width:300%; text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #FFFFFF; border: 0px solid #C0C0C0;}
h1 {font-size:42px; font-weight:150; line-height:42px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:27px; font-weight:300; line-height:27px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* Firefox (682.667〜1023)×(0〜895) */
@media screen and (min-width:682.667px) and ( max-width:1023px) and (max-height:895px)
{
.hako{width:300%; border: text-align:left; justify-content: space-between;}
.dann{column-count: 2; text-align:left;}
.page4k{width:100%; background: #F0F0F0; border: 1px solid #C0C0C0;}
h1 {font-size:42px; font-weight:150; line-height:42px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:27px; font-weight:300; line-height:27px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* Safari (512〜682.666)×(896〜) */
@media screen and (min-width:512px) and ( max-width:682.666px) and (min-height:896px)
{
.hako{width:600%; text-align:left; justify-content: space-between;}
.dann{column-count: 1; text-align:left;}
.page4k{width:100%; background: #FFFFFF; border: 0px solid #C0C0C0;}
h1 {font-size:36px; font-weight:150; line-height:36px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:24px; font-weight:300; line-height:24px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* Firefox (512〜682.666)×(0〜895) */
@media screen and (min-width:512px) and ( max-width:682.666px) and (max-height:895px)
{
.hako{width:600%; text-align:left; justify-content: space-between;}
.dann{column-count: 1; text-align:left;}
.page4k{width:100%; background: #F0F0F0; border: 1px solid #C0C0C0;}
h1 {font-size:36px; font-weight:150; line-height:36px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:24px; font-weight:300; line-height:24px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* Safari (667〜667) */
@media screen and (min-width:667px) and (max-width:667px)
{
.hako{width:600%; text-align:left; justify-content: space-between;}
.dann{column-count: 1; text-align:left;}
.page4k{width:100%; background: #FFFFFF; border: 0px solid #C0C0C0;}
h1 {font-size:36px; font-weight:150; line-height:36px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:24px; font-weight:300; line-height:24px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* Safari (409.6〜512)×(896〜) */
@media screen and (min-width:409.6px) and ( max-width:512px) and (min-height:840px)
{
.hako{width:600%; text-align:left; justify-content: space-between;}
.dann{column-count: 1; text-align:left;}
.page4k{width:100%; background: #FFFFFF; border: 0px solid #C0C0C0;}
h1 {font-size:36px; font-weight:150; line-height:36px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:24px; font-weight:300; line-height:24px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* Firefox (409.6〜512)×(0〜895) */
@media screen and (min-width:409.6px) and ( max-width:512px) and (max-height:839px)
{
.hako{width:600%; text-align:left; justify-content: space-between;}
.dann{column-count: 1; text-align:left;}
.page4k{width:100%; background: #F0F0F0; border: 1px solid #C0C0C0;}
h1 {font-size:36px; font-weight:150; line-height:36px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:24px; font-weight:300; line-height:24px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* Safari (0〜409.6)×(848〜) */
@media screen and ( max-width:409.6px) and (min-height:840px)
{
.hako{width:600%; text-align:left; justify-content: space-between;}
.dann{column-count: 1; text-align:left;}
.page4k{width:100%; background: #FFFFFF; border: 0px solid #C0C0C0;}
h1 {font-size:30px; font-weight:200; line-height:33px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:21px; font-weight:300; line-height:21px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* Firefox (0〜409.6)×(0〜847) */
@media screen and (max-width:409.6px) and (max-height:839px)
{
.hako{width:600%; text-align:left; justify-content: space-between;}
.dann{column-count: 1; text-align:left;}
.page4k{width:100%; background: #F0F0F0; border: 1px solid #C0C0C0;}
h1 {font-size:30px; font-weight:200; line-height:30px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
h2 {font-size:21px; font-weight:300; line-height:21px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* Firefox iPhone SE3 (0〜375) */
@media screen and (max-width:375px) and ((max-height:548px) or (min-height:550px))
{
.hako{width:600%; text-align:left; justify-content: space-between;}
.dann{column-count: 1; text-align:left;}
.page4k{width:100%; background: #F0F0F0; border: 1px solid #C0C0C0;}
.h1{height: 60px;  margin:15px 0px 15px 0px; padding: 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center;}
h1 {font-size:30px; font-weight:200; line-height:30px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
.h2{height: 60px; margin:15px 0px 15px 0px; padding: 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center;vertical-align:middle;}
h2 {font-size:21px; font-weight:400; line-height:21px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}


/* Safari iPhone SE3 (0〜375)×(549) */
@media screen and (max-width:375px) and (((min-height:549px) and (max-height:549px)) or (min-height:840px))
{
.hako{width:600%; text-align:left; justify-content: space-between;}
.dann{column-count: 1; text-align:left;}
.page4k{width:100%; background: #FFFFFF; border: 0px solid #C0C0C0;}
.h1{height: 60px; margin:15px 0px 15px 0px; padding: 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center;}
h1 {font-size:30px; font-weight:200; line-height:30px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
.h2{height: 60px; margin:15px 0px 15px 0px; padding: 0px; display: flex; flex-wrap: wrap; justify-content: center; place-items: center;vertical-align:middle;}
h2 {font-size:21px; font-weight:400; line-height:21px; padding:0; margin:0; letter-spacing:0px; vertical-align:middle;}
}