.header { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%; z-index: 10; }

.header__inner { padding: 20px 0 0; }

@media (min-width: 1441px) { .header__inner { padding: 40px 0 0; } }

@media (max-width: 500px) { .header__inner { padding: 20px 0 0; } }

.header__ttl { display: flex; justify-content: center; align-items: center; font-weight: bold; position: relative; font-size: 42px; color: #fff; text-shadow: 0 0 10px #3c0a00; }

@media (max-width: 500px) { .header__ttl { flex-direction: column; } }

@media (max-width: 500px) { .header__ttl-span { margin: 10px 0 0; font-size: 28px; } }

.header__ttl__logo { display: flex; justify-content: space-between; }

.header__ttl__logo-logo01 { position: relative; margin: 0 10% 0 0; width: 250px; }

@media (max-width: 500px) { .header__ttl__logo-logo01 { width: 44%; } }

.header__ttl__logo-logo01::before, .header__ttl__logo-logo01::after { content: ""; display: inline-block; width: 40px; height: 4px; background: #fff; box-shadow: 0 0 10px #3c0a00; position: absolute; top: 50%; right: -22%; }

@media (max-width: 500px) { .header__ttl__logo-logo01::before, .header__ttl__logo-logo01::after { top: 50%; right: -25%; transform: translate(-50%, -50%); } }

.header__ttl__logo-logo01::before { transform: rotate(45deg); }

.header__ttl__logo-logo01::after { transform: rotate(-45deg); }

.header__ttl__logo-logo02 { margin: 0 20px 0 0; width: 343px; }

@media (max-width: 500px) { .header__ttl__logo-logo02 { margin: 0; width: 44%; } }

.mv { position: relative; background: url(../images/webp/main_logo.webp) no-repeat center/cover; height: 165vh; }

@media (min-width: 1441px) { .mv { height: 150vh; } }

@media (max-width: 500px) { .mv { background: url(../images/webp/hero_bg-sp.webp) no-repeat center/cover; height: 100vh; } }

@media (max-width: 500px) { .mv__inner { padding: 0; width: 100%; } }

.mv .hero { position: relative; padding: 650px 0 0; width: 82%; z-index: 2; }

@media (min-width: 1441px) { .mv .hero { padding: 840px 0 0; } }

@media (max-width: 500px) { .mv .hero { padding: 120px 0 0; width: 100%; } }

@media (max-width: 500px) { .mv .hero__bg__ttl { position: absolute; top: 14%; left: 48%; transform: translateX(-50%); width: 130%; z-index: -1; } }

.mv .hero__ttl { margin: 0 0 0 -30px; width: 105%; color: #fff; text-shadow: 0 0 10px #3c0a00; }

@media (max-width: 500px) { .mv .hero__ttl { margin: 190px -10px 0; width: 105%; } }

.mv .hero__txt { margin: 20px 0 0; text-shadow: 0 0 10px #3c0a00; }

.mv .hero__list { display: flex; justify-content: space-between; flex-wrap: wrap; margin: 10px 0 0; }

@media (max-width: 500px) { .mv .hero__list { margin: 0; width: 100%; } }

.mv .hero__list__item { margin: 14px 0 0; padding: 8px 0; width: calc((100% - 30px) / 3); font-weight: bold; font-size: 1.8rem; text-align: center; background: #fff; border: 2px solid #231815; color: #231815; }

@media (max-width: 500px) { .mv .hero__list__item { margin: 6px 0 0; width: 49%; font-size: 16px; } }

.mv__avatar { position: absolute; bottom: -220px; right: -4%; width: 430px; z-index: 1; }

@media (min-width: 1441px) { .mv__avatar { bottom: -26%; right: -4%; width: 590px; } }

@media (max-width: 500px) { .mv__avatar { bottom: -40px; right: 15%; width: 230px; } }

.mv__avatar-desc { position: absolute; top: 0%; right: 30%; writing-mode: vertical-rl; font-weight: bold; font-size: 1.3rem; color: #fff; text-shadow: 0 0 10px #3c0a00; }

@media (min-width: 1441px) { .mv__avatar-desc { font-size: 1.8rem; } }

@media (max-width: 500px) { .mv__avatar-desc { top: 150px; right: -15%; width: 320px; font-size: 16px; writing-mode: inherit; } }

.mv__eyecatch { position: relative; display: inline-block; margin: 10px -5% 0; width: 107%; z-index: 20; }

@media (min-width: 1441px) { .mv__eyecatch { margin: 20px -5% 0; } }

@media (max-width: 500px) { .mv__eyecatch { margin: 190px -20px 0; width: 200%; z-index: 5; } }

.detail__inner { padding: 5em 5% 0; }

@media (max-width: 500px) { .detail__inner { padding: 10em 5% 0; } }

.detail__list { display: flex; justify-content: space-between; margin: 60px 0 0; }

@media (min-width: 1441px) { .detail__list { margin: 100px 0 0; } }

@media (max-width: 500px) { .detail__list { flex-direction: column; margin: 40px 0 0; } }

.detail__list__item { position: relative; margin: 0 3% 0 0; padding: 0 0 20px 0; width: 280px; background: #fff; }

@media (min-width: 1441px) { .detail__list__item { width: 360px; } }

@media (max-width: 500px) { .detail__list__item { display: flex; justify-content: flex-start; margin: 40px 0 0; padding: 0; width: 100%; height: 180px; } }

.detail__list__item::before { content: ""; display: inline-block; width: 26px; height: 26px; background: linear-gradient(45deg, transparent 50%, #e60012 50%, #870000); position: absolute; top: 50%; right: -9%; transform: translateY(-50%) rotate(45deg); }

@media (min-width: 1441px) { .detail__list__item::before { width: 30px; height: 30px; right: -10%; } }

@media (max-width: 500px) { .detail__list__item::before { top: 180px; right: 46%; transform: rotate(135deg); } }

.detail__list__item:last-child { margin: 0; }

@media (max-width: 500px) { .detail__list__item:last-child { margin: 40px 0 0; } }

.detail__list__item:last-child::before { display: none; }

.detail__list__item:first-child .detail__list__item-icon { margin: 50px auto; width: 180px; }

@media (min-width: 1441px) { .detail__list__item:first-child .detail__list__item-icon { width: 226px; } }

@media (max-width: 500px) { .detail__list__item:first-child .detail__list__item-icon { margin: 20px auto; width: 50%; } }

@media (max-width: 500px) { .detail__list__item:first-child .detail__list__item-icon img { width: 70%; } }

.detail__list__item:nth-child(2) .detail__list__item-icon { margin: 50px auto; width: 200px; }

@media (min-width: 1441px) { .detail__list__item:nth-child(2) .detail__list__item-icon { width: 256px; } }

@media (max-width: 500px) { .detail__list__item:nth-child(2) .detail__list__item-icon { margin: 20px auto; width: 50%; } }

@media (max-width: 500px) { .detail__list__item:nth-child(2) .detail__list__item-icon img { width: 80%; } }

.detail__list__item:nth-child(3) .detail__list__item-icon { margin: 30px auto; width: 120px; }

@media (min-width: 1441px) { .detail__list__item:nth-child(3) .detail__list__item-icon { margin: 50px auto; width: 147px; } }

@media (max-width: 500px) { .detail__list__item:nth-child(3) .detail__list__item-icon { margin: 20px auto; width: 50%; } }

@media (max-width: 500px) { .detail__list__item:nth-child(3) .detail__list__item-icon img { width: 45%; } }

.detail__list__item:nth-child(4) .detail__list__item-icon { margin: 80px auto; width: 180px; }

@media (min-width: 1441px) { .detail__list__item:nth-child(4) .detail__list__item-icon { width: 225px; } }

@media (max-width: 500px) { .detail__list__item:nth-child(4) .detail__list__item-icon { margin: 20px auto; width: 50%; } }

@media (max-width: 500px) { .detail__list__item:nth-child(4) .detail__list__item-icon img { width: 90%; } }

@media (max-width: 500px) { .detail__list__item-icon { text-align: center; } }

.detail__list__item-ttl { padding: 30px 0; font-weight: bold; font-size: 1.9rem; line-height: 1.4; font-style: italic; text-align: center; background: linear-gradient(45deg, #e60012, #870000); color: #fff; }

@media (min-width: 1441px) { .detail__list__item-ttl { font-size: 42px; } }

@media (max-width: 500px) { .detail__list__item-ttl { padding: 60px 0; width: 50%; font-size: 18px; } }

.detail__note { margin: 20px 0 0; font-weight: bold; font-size: 1.2rem; letter-spacing: 0.04em; color: #fff; }

@media (min-width: 1441px) { .detail__note { font-size: 25px; } }

.detail__eyecatch { position: relative; display: inline-block; margin: -40px -5% 0; width: 107%; overflow-x: hidden; z-index: 3; }

@media (max-width: 500px) { .detail__eyecatch { margin: -20px -5%; width: 170%; } }

.detail__eyecatch-txt { margin: 40px 0 0; font-weight: bold; font-size: 2.4rem; font-style: italic; color: #fff; transform: rotate(-4deg); }

@media (min-width: 1441px) { .detail__eyecatch-txt { margin: 60px 0 0; font-size: 50px; } }

@media (max-width: 500px) { .detail__eyecatch-txt { font-size: 20px; } }

.flow { position: relative; }

.flow .sec-ttl { top: 50px; }

.flow__inner { padding: 80px 5%; }

@media (max-width: 500px) { .flow__inner { padding: 100px 5% 40px; } }

.flow__block { position: relative; margin: 60px 0 0; padding: 40px; background: #fff; z-index: 5; }

@media (min-width: 1441px) { .flow__block { margin: 100px 0 0; } }

@media (max-width: 500px) { .flow__block { padding: 20px; } }

.flow__avatar { position: absolute; top: 4px; right: 14%; width: 200px; z-index: 0; }

@media (min-width: 1441px) { .flow__avatar { width: 260px; top: 22px; right: 10%; } }

@media (max-width: 500px) { .flow__avatar { width: 180px; top: 20px; right: 25%; z-index: 0; } }

.flow__head { position: relative; z-index: 10; padding: 40px 35px; border: 2px solid #231815; }

@media (max-width: 500px) { .flow__head { padding: 20px; } }

.flow__head-ttl { display: flex; justify-content: center; align-items: center; flex-direction: row-reverse; font-weight: bold; font-size: 1.6rem; }

@media (min-width: 1441px) { .flow__head-ttl { font-size: 42px; } }

.flow__head-ttl img { margin: 0 20px 0 0; width: 70px; }

.flow__list { display: flex; margin: 40px 0 0; }

@media (max-width: 500px) { .flow__list { flex-direction: column; } }

.flow__list__item { padding: 30px 20px; width: 25%; }

@media (min-width: 1441px) { .flow__list__item { padding: 50px; } }

@media (max-width: 500px) { .flow__list__item { padding: 30px 10px; width: 100%; } }

.flow__list__item-num { font-weight: bold; font-size: 1.2rem; text-align: center; }

@media (min-width: 1441px) { .flow__list__item-num { font-size: 38px; } }

.flow__list__item:nth-child(odd) { background: #dceede; }

.flow__list__item:nth-child(even) { background: #ebf5ec; }

.flow__list__item:first-child .flow__list__item-device { width: 250px; }

@media (min-width: 1441px) { .flow__list__item:first-child .flow__list__item-device { width: 297px; } }

@media (max-width: 500px) { .flow__list__item:first-child .flow__list__item-device { width: 80%; } }

.flow__list__item:not(:first-child) .flow__list__item-device { width: 90px; }

@media (min-width: 1441px) { .flow__list__item:not(:first-child) .flow__list__item-device { width: 106px; } }

.flow__list__item-device { margin: 40px auto; }

@media (max-width: 500px) { .flow__list__item-device { margin: 20px auto; } }

.flow__list__item-txt { font-size: 0.9rem; line-height: 1.6; }

@media (min-width: 1441px) { .flow__list__item-txt { font-size: 18px; line-height: 1.8; } }

@media (max-width: 500px) { .flow__list__item-txt { font-size: 14px; } }

.flow__foot { margin: 60px 0 0; }

@media (max-width: 500px) { .flow__foot { margin: 30px 0 0; } }

.flow__foot-ttl { margin: 0 auto; width: 84%; }

@media (min-width: 1441px) { .flow__foot-ttl { width: 1096px; } }

@media (max-width: 500px) { .flow__foot-ttl { margin: 0 -5%; width: 110%; } }

.flow__banar { display: flex; justify-content: center; align-items: center; }

@media (max-width: 500px) { .flow__banar { margin: 20px 0 0; } }

.flow__banar-img { margin: 0 20px; width: 300px; }

@media (max-width: 500px) { .flow__banar-img { margin: 0 10px 0 0; width: 100%; } }

@media (max-width: 500px) { .flow__banar-img:last-child { margin: 0; } }

.apply { position: relative; }

@media (max-width: 500px) { .apply .sec-ttl { top: 40px; } }

.apply__inner { padding: 60px 5%; }

@media (max-width: 500px) { .apply__inner { padding: 120px 5% 40px; } }

.apply__block { position: relative; margin: 80px 0 0; padding: 20px 40px; background: #fff; }

@media (min-width: 1441px) { .apply__block { margin: 100px 0 0; } }

@media (max-width: 500px) { .apply__block { margin: 30px 0 0; padding: 20px 10px; } }

.apply__avatar { position: absolute; top: 5px; right: 16%; width: 160px; }

@media (min-width: 1441px) { .apply__avatar { top: 0; right: 12%; width: 220px; } }

@media (max-width: 500px) { .apply__avatar { top: 0px; right: 30%; width: 140px; } }

.apply__list { padding: 40px 0; border-bottom: 1px dotted #231815; }

.apply__list:nth-child(2) .apply__list-txt { margin: 10px; }

.apply__list:last-child { border-bottom: none; }

.apply__list-txt { margin: 0 0 10px 0; font-weight: normal; font-size: 1.3rem; }

@media (min-width: 1441px) { .apply__list-txt { font-size: 30px; } }

@media (max-width: 500px) { .apply__list-txt { font-size: 16px; } }

.apply__list-desc { font-size: 1.3rem; line-height: 2; }

@media (min-width: 1441px) { .apply__list-desc { font-size: 30px; } }

@media (max-width: 500px) { .apply__list-desc { font-size: 16px; } }

.apply__list-desc-arrow { text-align: center; }

.apply__list-desc .pc-only { display: inline-block; }

@media (max-width: 500px) { .apply__list-desc .pc-only { display: none; } }

.apply__list-img01 { margin: 0 10px; width: 378px; }

@media (max-width: 500px) { .apply__list-img01 { margin: 0; width: 60%; } }

.apply__list-img02 { margin: 0 24px; width: 378px; vertical-align: middle; }

@media (max-width: 500px) { .apply__list-img02 { margin: 10px 24px 0; width: 80%; } }

.apply__list-img03 { margin: 0 24px; width: 400px; vertical-align: middle; }

@media (max-width: 500px) { .apply__list-img03 { margin: 5px 24px 0; width: 80%; } }

.terms { position: relative; }

@media (max-width: 500px) { .terms .sec-ttl { top: 84px; } }

.terms__inner { padding: 60px 5%; }

@media (max-width: 500px) { .terms__inner { padding: 60px 5%; } }

.terms__block { position: relative; margin: 80px 0 0; padding: 60px 40px; background: #fff; }

@media (min-width: 1441px) { .terms__block { margin: 100px 0 0; padding: 60px; } }

@media (max-width: 500px) { .terms__block { padding: 20px; } }

.terms__block__txt { font-size: 1.4rem; line-height: 2; }

@media (min-width: 1441px) { .terms__block__txt { font-size: 30px; } }

@media (max-width: 500px) { .terms__block__txt { font-size: 16px; } }

.terms__avatar { position: absolute; top: 10px; right: 15%; width: 180px; }

@media (min-width: 1441px) { .terms__avatar { top: 0; right: 12%; width: 240px; } }

@media (max-width: 500px) { .terms__avatar { top: 0; right: 26%; } }

.terms .drop-menu { margin: 40px 0 0; }

@media (max-width: 500px) { .terms .drop-menu { margin: 40px -5% 0; } }

.terms .drop-menu__item { position: relative; padding: 25px 40px 15px; font-size: 1.6rem; }

@media (max-width: 500px) { .terms .drop-menu__item { padding: 20px 10px 10px; font-size: 18px; } }

.terms .drop-menu__item:first-child, .terms .drop-menu__item:nth-child(2), .terms .drop-menu__item:nth-child(3) { background: #cedfe9; }

.terms .drop-menu__item:nth-child(2), .terms .drop-menu__item:nth-child(3), .terms .drop-menu__item:last-child { margin: 2px 0 0; }

.terms .drop-menu__item:nth-child(4), .terms .drop-menu__item:last-child { background: #e6e6e6; }

.terms .drop-menu__item:nth-child(4) { margin: 40px 0 0; }

@media (max-width: 500px) { .terms .drop-menu__item:last-child { padding: 10px; font-size: 18px; } }

.terms .drop-menu__item-ttl::before, .terms .drop-menu__item-ttl::after { content: ""; display: inline-block; width: 20px; height: 2px; background: #231815; position: absolute; }

.terms .drop-menu__item-ttl::before { top: 40px; right: 40px; transform: translateY(-50%); }

@media (max-width: 500px) { .terms .drop-menu__item-ttl::before { top: 30px; right: 20px; } }

.terms .drop-menu__item-ttl::after { top: 40px; right: 40px; transform: translateY(-50%) rotate(90deg); opacity: 1; transition: 0.5s; }

@media (max-width: 500px) { .terms .drop-menu__item-ttl::after { top: 30px; right: 20px; } }

@media (min-width: 1441px) { .terms .drop-menu__item-ttl { font-size: 30px; } }

.terms .drop-menu__item-txt { height: 0; padding: 10px 0 0; font-size: 20px; line-height: 0; overflow: hidden; opacity: 0; transition: 0.1s; color: transparent; }

.terms .is-active.drop-menu__item-ttl:after { transform: rotate(0); opacity: 0; transition: 0.5s; }

.terms .is-open.drop-menu__item-txt { height: auto; line-height: 1.4; color: #231815; opacity: 1; transition: 0.5s; }

.terms .drop-menu__item-txt a {
    text-decoration: underline;
}

.footer { margin: 0 0 60px 0; border-bottom: 1px solid #231815; }

.footer__inner { padding: 80px 5% 30px; }

@media (max-width: 500px) { .footer__inner { padding: 80px 5%; } }

.footer__logo { display: block; margin: 0 auto; width: 300px; text-align: center; }

@media (min-width: 1441px) { .footer__logo { width: 363px; } }

.footer__banar { display: flex; justify-content: center; align-items: center; margin: 40px 0 0; }

@media (max-width: 500px) { .footer__banar { flex-direction: column; } }

.footer__banar-txt { font-weight: bold; text-align: center; margin: 20px 0 0; }

@media (min-width: 1441px) { .footer__banar-txt { font-size: 21px; } }

.footer__banar-img { margin: 0 20px; width: 300px; }

@media (max-width: 500px) { .footer__banar-img { margin: 0; } }

.footer__copyright { margin: 40px 0 0; text-align: center; }

@media (max-width: 500px) { .footer__copyright { font-size: 14px; } }



#header {
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	position: absolute;
	top: 2%;
	left: 50%;
	z-index: 1;
	transform: translateX(-50%);
}
#header .inner {
    max-width: 860px;
	padding: 0;
}
#header .inner h1 {
    font-size: 42px;
    font-weight: bold;
    color: #fff;
    text-shadow: 0 0 10px #3c0a00;
    display: flex;
    align-items: center;
    justify-content: center;
}
#header .inner h1 div {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
#header .inner h1 > span {
    margin-left: 2%;
    font-size: min(40px, 1.8vw);
}
#header .inner figure img {
    width: auto;
    max-width: 100%;
    height: 5vw;
    max-height: 140px;
}
#header .inner .plus {
    margin: 0 3% 0 10%;
	position: relative;
}
#header .inner .plus::before, #header .inner .plus::after {
    content: "";
    display: inline-block;
    width: 2vw;
    height: 4px;
    background: #fff;
    box-shadow: 0 0 10px #3c0a00;
    position: absolute;
    top: 50%;
    right: -22%;
}
#header .inner .plus::before {
    transform: rotate(45deg);
}
#header .inner .plus::after {
    transform: rotate(-45deg);
}
#mv {
    width: 100%;
    background: url(../images/main_bg.svg) no-repeat center/ 496%;
    position: relative;
}
#mv .inner {
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: 0;
	position: relative;
	overflow: hidden;
}
#mv .inner .catch {
    width: 73%;
    position: absolute;
    top: 57%;
    z-index: 2;
    left: 7%;
}
#mv .inner .catch .hero ul {
	width: 95%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#mv .inner .catch .hero ul li {
	width: 32.5%;
	margin-bottom: 1.5%;
    padding: 0.4em 0;
    color: #231815;
    background: #fff;
    border: 2px solid #231815;
    font-weight: bold;
    font-size: min(28px, 1.5vw);
    text-align: center;
}
#mv .inner .item01 {
    width: 30%;
    max-width: 600px;
    position: absolute;
    top: 55%;
    left: 74%;
    z-index: 1;
}
#mv .inner .text01 {
    position: absolute;
    bottom: 9%;
    right: 3%;
    writing-mode: vertical-rl;
    font-weight: bold;
    font-size: min(28px, 1.5vw);
    color: #fff;
    z-index: 3;
    text-shadow: 0 0 10px #3c0a00;
}
#mv .item02 {
    width: 107%;
    max-width: 2000px;
    position: absolute;
    top: 86%;
    left: 50%;
    z-index: 2;
    transform: translateX(-50%);
}
#mv .bg {
	max-width: 1920px;
	margin: 0 auto;
}
@media (max-width: 500px) {
	#header .inner h1 {
	    display: block;
	    text-align: center;
    }
    #header .inner h1 div {
	    justify-content: space-between;
	}
	#header .inner figure {
	    width: 45%;
	}
	#header .inner figure img {
	    height: auto;
	    max-height: initial;
	}
	#header .inner .plus::before, #header .inner .plus::after {
	    width: 25px;
    }
	#header .inner h1 > span {
	    margin-left: 0;
	    font-size: 30px;
	}
	#mv {
		background: url(../images/webp/hero_bg-sp.webp) no-repeat center/cover;
	}
	#mv .inner {
	    height: 190vw;
	    max-height: 720px;
	    min-height: 700px;
	}
	#mv .inner .sp-title {
	    width: 115%;
	    position: absolute;
	    top: 10%;
	    left: 50%;
	    transform: translateX(-50%);
	}
	#mv .inner .catch {
	    width: 100%;
	    top: 40%;
	    left: 0;
	}
	#mv .inner .catch .hero ul li {
	    width: 49.5%;
	    font-size: min(16px, 4.3vw);
	}
	#mv .inner .item01 {
	    width: 65%;
	    top: 70%;
	    left: 50%;
	    transform: translateX(-50%);
	}
	#mv .item02 {
	    width: 150%;
	    top: 95%;
	}
	#mv .inner .text01 {
	    bottom: 5%;
	    right: 0;
	    width: 100%;
	    text-align: center;
	    writing-mode: initial;
	    font-size: min(28px, 4.5vw);
	}
}