﻿/*---------------------------------------------------------------------
【 共通 】
---------------------------------------------------------------------*/
body {
    background-image: url(../img/bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom center;
    background-attachment: fixed;
}
section {
    margin: 0 auto;
    padding: 18rem 6rem;
    background: #fff;
}

.section-img {
    padding: 0 0;
}


.section-arrow {
    padding: 10rem 4rem 1rem;
}

h2 {
    font-size: 8rem;
    font-family: 'Noto Serif JP', serif;
    -webkit-font-feature-settings: 'palt' 1;
    font-feature-settings: 'palt' 1;
    padding-bottom: 8rem;
    line-height: 1.4;
    font-weight: bold;

}

h3 {
    font-size: 6rem;
    font-family: 'Noto Sans JP', sans-serif;
    -webkit-font-feature-settings: 'palt' 1;
    font-feature-settings: 'palt' 1;
    padding-bottom: 3rem;
    margin-top: 4rem;
    line-height: 1.4;
    text-align: center;
}

h4 {
    font-size: 5.6rem;
    font-family: 'Noto Sans JP', sans-serif;
    -webkit-font-feature-settings: 'palt' 1;
    font-feature-settings: 'palt' 1;
    padding-bottom: 0.6rem;
}
.mv {
    background: #050622;
    position: relative;
}

.moveMv1 {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 10;
}

.moveMv2 {
    position: absolute;
    bottom: 4rem;
    left: 50%;
    transform: translateX(-50%);
    width: 94%;
    z-index: 10;
}

.mv img {
    margin: 0 auto;
    width: 100%;
    height: 100%;
}

.r {
    color: #95000E;
}
.r2 {
    color: #FF7F02;
}

.y {
    color: #EEDEA9;
}

.w {
    color: #fff;
}
.notice.w {
    color: #fff;
    opacity: 0.8;
}

.bl {
    color: #04a1aa;
}

.arrow {
    width: 30px;
    height: 30px;
    margin: 6rem auto 0;
    position: relative;
    display: block;
}

.arrow:before,
.arrow:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    border-color: #222;
    border-style: solid;
    border-width: 0 0 5px 5px;
    transform: rotate(-45deg) translate(-50%, -50%);
    left: 70%;
}

.arrow:after {
    bottom: 14px;
}

.notice {
    text-align: right;
    font-size: 2.6rem;
    opacity: 0.8;
}

.ps {
    padding: 0 6rem;
}
.p0 {
    padding: 12rem 0;
}


/*---------------------------------------------------------------------
【 フォーム 】
---------------------------------------------------------------------*/
.form {
    padding: 6rem 6rem 6rem;
}

.form_notice {
    color: #fff;
}

.mv-form {
    color: #fff;
    background: #000;
    padding: 4rem 6rem 6rem;
}

.mv-form .btn_copy {
    color: #fff;
}

.mv-form .form_notice {
    color: #fff;
    margin: 2rem auto 0;
}

.mv-form.form form {
    grid-template-columns: 2fr 1fr;
    grid-template-rows: 1fr auto;
    gap: 0 2rem;
}

.mv-form.form .form_btn button {
    font-size: 4rem;
    padding-right: 3rem;
}

.mv-form.form .form_label {
    font-size: 3rem;
    left: 7rem;
}

.mv-form.form .form__lead {
    margin-bottom: 3rem;
    font-size: 4.4rem;
    text-align : left;
    line-height: 1.5;
}

.mv-form.form .form_input {
    padding: 0.7em 0.5em 0.7em 7rem;
    font-size: 4rem;
}

.mv-form.form .btn_copy.top {
    margin-top: 2rem;
    text-align: center;
}
.mv-form.form .form_must {
    font-size: 2.2rem;
}

.mv-form__box {
    background: #fff;
    padding:4rem 3rem;
    border-radius: 2rem;
}




/*---------------------------------------------------------------------
【 no-must 】
---------------------------------------------------------------------*/
.form.no-must .form_must {
    display: none;
}

.form.no-must .form_btn button {
    border: none;
    border-radius: 6px;
    background: #00B44B;
    font-size: 4.8rem;
}

.mv-form.form.no-must .form_input {
    padding: 0.9em 0.5em 0.9em 2rem;
    font-size: 4rem;
}

.mv-form.form.no-must .form_label {
    left: 3rem;
}

.form.img-form {
    background: #0A3068;
}
.form.img-form .form__lead {
    margin-bottom: 4rem;
    color: #fff;
}

.form.img-form.no-must .form__lead {
    text-align: left;
}
.form.img-form.no-must .form_btn button {
    width: 50%;
}
.form.img-form.no-must .btn_copy {
    color: #fff;
    text-align: left;
}
.form.img-form .btn_copy {
    color: #fff;
}
.form.img-form.no-must .form_input {
    padding: 0.45em 0.5em 0.45em 3rem;
}
.form.img-form.no-must .form_label {
    left: 4rem;
}

.form__title {
    text-align: center;
    font-size: 5.4rem;
    margin-bottom: 3rem;
    font-weight: bold;
    color: #fff;
    line-height: 1.4;
    font-family: 'Noto Serif JP', serif;
}

.img-form .form__title{
    text-align: left;
}

/*---------------------------------------------------------------------
【 mv 】
---------------------------------------------------------------------*/
.mv {
    position: relative;
}
.mv .tokuten {
    position: absolute;
    width: 32%;
    height: 32%;
    bottom: 2rem;
    left: 2rem;
}

/*---------------------------------------------------------------------
【 move-content 】
---------------------------------------------------------------------*/
.move-content {
    background: #390006;
}
.move-content h2 {
    text-align: center;
    color: #EEDEA9;
    line-height: 0.9;
    letter-spacing: 0.4rem;
    padding-bottom: 6rem;
}

/*---------------------------------------------------------------------
【 profile 】
---------------------------------------------------------------------*/
.profile_wrapper {
    margin-bottom: 10rem;
}

.title__top {
    font-size: 4rem;
    margin-bottom: 2rem;
    font-family: 'Noto Serif JP', serif;
}
.profile {
    color: #fff;
    background: #9C000E;
    background: linear-gradient(145deg,rgba(156, 0, 14, 1) 0%, rgba(55, 0, 5, 1) 100%);
}
.profile li {
    position: relative;
    padding-left: 1em;
    text-align: left;
    line-height: 1.4;
    font-size: 4.2rem;
}

.profile li + li {
    padding-top: 4rem;
}

.profile  li::before {
    content: "•";
    position: absolute;
    left: 0;
}

.profile__box {
    border-bottom: 1px solid #fff;
    margin-bottom: 4rem;

}

.profile__job {
    font-family: 'Noto Serif JP', serif;
}

.profile__name {
    font-size: 8rem;
    font-family: 'Noto Serif JP', serif;
    font-weight: bold;
    color: #fff;
    line-height: 1.2;
    padding-bottom: 4rem;
}

.profile .notice {
    text-align: right;
}

.imgBox {
    border: 1px solid #fff;
    padding: 10rem 6rem;
}

.imgBox_number {
    font-family: 'Noto Serif JP', serif;
    font-size: 3.6rem;
    margin-bottom: 1.4rem;
}

.imgBox_detail {
    font-size: 5.6rem;
    margin-bottom: 4rem;
    font-family: 'Noto Serif JP', serif;
    line-height: 1.4;
}

.imgBox + .imgBox {
    margin-top: 6rem;
}

/*---------------------------------------------------------------------
【 move 】
---------------------------------------------------------------------*/
.move {
    background: #877738;
    background: linear-gradient(145deg,rgba(135, 119, 56, 1) 0%, rgba(94, 68, 13, 1) 100%);
    color: #fff;
}


/*---------------------------------------------------------------------
【 scfooter 】
---------------------------------------------------------------------*/
#scfooter .form {
    background: #000;
}
#scfooter .form.no-must .form_input {
    padding: 0.7em 0.5em 0.7em 3rem;
}
#scfooter .form.no-must .form_label {
    left: 3rem;
}

/*---------------------------------------------------------------------
【 manga 】
---------------------------------------------------------------------*/
.manga {
    background: #fefcf0;
    padding: 12rem 6rem 0;
}
.manga .txt_c + .arrow {
    margin-top: 2rem;
}


.manga img + img {
    margin-top: 4rem;
}

.manga img {
    border: 2px solid #050622;
}
.manga-video {
    position: relative;
    margin-top: 4rem;
}
.manga-video-mp4 {
    position: absolute;
    top: 26.5rem;
    left: 8.5rem;
    width: 33.8rem;
    border: 0px;
}

rt {
    font-size: 40%;
}

.mv-form.pt6 {
    padding-top: 6rem;
}