html{ -webkit-text-size-adjust:none; margin:0 auto; padding:0;}
body{ margin:0;}
.clear{ clear:both; height:0;}
.center{ text-align:center;}
img{ border:0; vertical-align:bottom; max-width: 100%; height: auto;}
ul, ol{ margin:0; padding:0; list-style:none;}
p{ margin:0;}

:root{
    --black: #333333;
    --blue: #2f93f3;
    --red: #f03333;
    --pink: #ec9d9c;
    --gray: #999999;
    --lightgray: #e5e9eb;
    --base-font-color: #333333;
    --content-width: 1220px;
    --small-content-width: 1196px;
    --small-content-width-sp: calc(100% - var(--comp-60) - var(--comp-60));
    --content-padding: 0 12px;

    --comp-250: 33.7837837837837vw;
    --comp-230: 31.081081081081vw;
    --comp-220: 29.7297297297297vw;
    --comp-210: 28.3783783783783vw;
    --comp-200: 27.027027027027vw;
    --comp-195: 26.3513513513513vw;
    --comp-190: 25.6756756756756vw;
    --comp-185: 25vw;
    --comp-180: 24.3243243243243vw;
    --comp-175: 23.6486486486486vw;
    --comp-170: 22.9729729729729vw;
    --comp-165: 22.2972972972972vw;
    --comp-160: 21.6216216216216vw;
    --comp-155: 20.9459459459459vw;
    --comp-150: 20.2702702702702vw;
    --comp-145: 19.5945945945945vw;
    --comp-140: 18.9189189189189vw;
    --comp-135: 18.2432432432432vw;
    --comp-130: 17.5675675675675vw;
    --comp-125: 16.8918918918918vw;
    --comp-120: 16.2162162162162vw;
    --comp-115: 15.5405405405405vw;
    --comp-110: 14.8648648648648vw;
    --comp-105: 14.1891891891891vw;
    --comp-100: 13.5135135135135vw;
    --comp-95: 12.83783783783783vw;
    --comp-90: 12.1621621621621vw;
    --comp-85: 11.48648648648648vw;
    --comp-80: 10.8108108108108vw;
    --comp-75: 10.13513513513513vw;
    --comp-70: 9.459459459459459vw;
    --comp-65: 8.738738738738738vw;
    --comp-60: 8.108108108108108vw;
    --comp-55: 7.432432432432432vw;
    --comp-50: 6.756756756756756vw;
    --comp-45: 6.081081081081081vw;
    --comp-40: 5.405405405405405vw;
    --comp-35: 4.729729729729729vw;
    --comp-30: 4.054054054054054vw;
    --comp-25: 3.378378378378378vw;
    --comp-20: 2.702702702702702vw;
    --comp-15: 2.027027027027027vw;
    --comp-10: 1.351351351351351vw;
    --comp-5: 0.6756756756756756vw;

    --comp-88: 11.8918918918918vw;
    --comp-66: 8.91891891891891vw;
    --comp-48: 6.48648648648648vw;
    --comp-46: 6.21621621621621vw;
    --comp-42: 5.67567567567567vw;
    --comp-36: 4.86486486486486vw;
    --comp-34: 4.59459459459459vw;
    --comp-32: 4.32432432432432vw;
    --comp-28: 3.78378378378378vw;
    --comp-27: 3.64864864864865vw;
    --comp-26: 3.51351351351351vw;
    --comp-24: 3.24324324324324vw;
    --comp-22: 2.97297297297297vw;
    --comp-20: 2.70270270270270vw;
    --comp-18: 2.43243243243243vw;
    --comp-16: 2.16216216216216vw;
    --comp-14: 1.89189189189189vw;
    --comp-12: 1.62162162162162vw;
    --comp-8: 1.081081081081081vw;
    --comp-6: 0.81081081081081vw;
}

/*---------------------------------------------
 CONTAINER/TOP
---------------------------------------------*/

#container{ font-family: serif; width: 100%; margin: 0 auto; color: var(--black); font-feature-settings: "palt"; min-width: 1220px; background: #fff;}
#container *{ font-family: serif;}
/*#container p:not([class]){ font-size: 16px; line-height: 1.9; letter-spacing: 0.1em;}*/
#container p.large{ font-size: 18px; line-height: 1.9; letter-spacing: 0.1em; font-weight: 500;}
#container p:not([class]) .icon{ aspect-ratio: 1 / 1; width: 1.4em; display: inline-block; vertical-align: middle; line-height: 1;}
#container p:not([class]) .icon img{ object-fit: contain; width: 100%; height: 100%;}
#container .indent01{ text-indent: -1em !important; padding-left: 1em !important; display: inline-block !important; line-height: inherit !important; font-size: inherit !important;}
p:not([class]) a{ color: var(--black); transition: all ease 0.3s; text-decoration: underline;}
#container .u-caution{ font-size: 12px; line-height: 1.6; color: #666666; margin: 120px auto 0; width: var(--content-width); padding: var(--content-padding); box-sizing: border-box; }
#container .red{ color: var(--red) !important;}
#container p b{ font-weight: 500;}

@media (any-hover: hover) {
p:not([class]) a:hover{ opacity: 0.7;}
}

@media screen and (width > 750px){
.sp{ display: none !important;}
*{ scroll-margin-top: 0; }
.wrapTabBox * { scroll-margin-top: 120px; }
}

@media screen and (width <= 749px){
:root{
    --content-width: 100%;
}
#container{ min-width: 0;height: 100vh;
}
.pc{ display: none !important;}
*{ scroll-margin-top: 55px; }
.wrapTabBox *{ scroll-margin-top: calc(55px + var(--comp-200)); }

#container{ width: 100%;}
/*#container p:not([class]){ font-size: var(--comp-24); }*/
#container p.large{ font-size: var(--comp-26); max-width: var(--small-content-width-sp); margin-left: auto; margin-right: auto;}
#container .u-caution{ font-size: var(--comp-20); margin: var(--comp-120) auto 0; padding: 0; width: calc(100% - var(--comp-60) - var(--comp-60));}
}

/*-- content --*/
hgroup.mainTtlGroup{ margin-bottom: 80px;}
hgroup.mainTtlGroup:has( > .simplePageTtl:only-child){ margin-bottom: 100px;}
hgroup.mainTtlGroup > *{ width: var(--content-width); padding: var(--content-padding); margin-left: auto; margin-right: auto;}
hgroup.mainTtlGroup .lead{ margin: 30px auto 0; font-size: 18px; text-align: center; line-height: 1.75; box-sizing: border-box; letter-spacing: 0.05em;}
.simplePageTtl{ margin: 0 auto; color: var(--black); box-sizing: border-box; text-align: center; font-weight: 500; font-size: 40px; letter-spacing: 0.1em; padding-bottom: 15px; position: relative; line-height: 1.8;}
.simplePageTtl::after{ content: ""; display: block; width: 200px; height: 4px; margin: 0 auto; background-color: var(--blue); position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
.simplePageTtl + h2{ display: flex; justify-content: center; align-items: center; font-size: 32px; letter-spacing: 0.2em; font-weight: 500; gap: 20px; margin: 30px auto 0;}
.simplePageTtl + h2 .icon{ display: block; aspect-ratio: 66 / 57; width: 66px;}
.simplePageTtl + h2 .icon img{ object-fit: contain; width: 100%; height: 100%;}
.simplePageTtl + h2 .text{ max-width: calc(100% - 20px - 66px); line-height: 1.75;}
#contents > .lead{ width: var(--small-content-width); margin: 0 auto 60px; box-sizing: border-box; font-size: 16px; line-height: 1.75; }
.contentCaution{ font-size: 16px; margin-top: 20px;}
.contentCaution a{ color: var(--black); text-decoration: underline; transition: all ease 0.3s;}
.flexBox{ display: flex;}
.bgWhite{ background-color: #fff;}
.bgBlack{ background-color: var(--black);}
.bgWhite,
.bgBlack{ padding: 100px 0;}
.bgWhite:first-child,
.bgBlack:first-child{ padding-top: 0;}
.bgWhite > .inner,
.bgBlack > .inner{ padding: 0 12px; width: var(--content-width); margin: 0 auto; box-sizing: border-box;}
.minBgBlack,
.minBgWhite{ width: var(--content-width); padding: var(--content-padding); box-sizing: border-box; margin: 0 auto; }
.minBgBlack > .inner{ padding: 60px 108px 100px; box-sizing: border-box; background-color: var(--black);}
.minBgWhite > .inner{ padding: 100px 108px; box-sizing: border-box; background-color: #fff;}
.simpleTtl{ font-size: 24px; font-weight: 700; text-align: center; margin: 0 auto 40px; line-height: 1.8; width: 100%}
.bgBlack .inner > .simpleTtl,
.minBgBlack .inner > .simpleTtl{ color: #fff;}
.bgWhite .inner > .simpleTtl,
.minBgWhite .inner > .simpleTtl{ color: var(--black);}

@media (any-hover: hover) {
.contentCaution a:hover{ opacity: 0.7;}
}

.contents { border-left: 10vw solid #e1eecf; border-right: 10vw solid #95cd9c;height: 100%; padding-top: 30px; padding-bottom: 80px; position: static;}

.ex2026contents {text-align:center; padding-right: var(--comp-15); }
h1.ex2026title { max-width: 360px; margin: 20px auto;}
h1.ex2026title img { width: 100%; height: auto;}
.ex2026contents p { font-size: 16px;}
.mb1em { margin-bottom: 1em;}
.ex2026info { max-width: 480px; border: #666 solid 1px; padding: 30px 15px;margin: 0 auto 40px;box-sizing: border-box;}
@media screen and (width <= 749px){
.ex2026contents {padding-right: var(--comp-18);  padding-left: var(--comp-18); }
h1.ex2026title { max-width: 280px; margin: 20px auto;}
h1.ex2026title img { width: 100%; height: auto;}
.ex2026info { width: calc(100vw - 24vw); }
.ex2026contents p { font-size: var(--comp-18);}
}

.mb20 { margin-bottom: 20px;}
.mb40 { margin-bottom: 40px;}
.mb60 { margin-bottom: 60px;}
.mb80 { margin-bottom: 80px;}