@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');

* {
box-sizing:border-box;
margin:0;
padding:0;
}

body {
font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Hiragino Sans","Meiryo",sans-serif;
font-size:12px;
background-color:#eeeeee;
color:#000;
line-height:1.6;
}

.pc {
    display: none;
}
.sp {
    display: block;
}
.text-red {
color: #e61e0f;
}
.bold {
    font-weight: bold;
}
.text-link {
    color: #e61e0f;
}
.text-link:hover {
    opacity: .8;
}

.site-header {
background-color:#000;
color:#fff;
display:flex;
flex-direction:column;
align-items:center;
gap:32px;
padding:48px 0 72px;
}

.site-header .header-inner {
width:100%;
padding:0 12px;
display:flex;
flex-direction:column;
align-items:center;
gap:12px;
}

.site-header .header-inner .header-toprow {
display:flex;
align-items:center;
justify-content:center;
gap:8px;
}

.site-header .header-inner .header-toprow .header-badge {
border:1px solid #ffffff;
border-radius:22px;
padding:4px 8px;
font-size:13px;
color:#ffffff;
}

.site-header .header-inner .header-toprow .header-sub {
font-size:13px;
color:#f2f2f2;
}

.site-header .header-inner .movie-title {
font-size:24px;
font-weight:bold;
color:#fff;
line-height:1.4;
text-align:center;
}

.site-header .header-inner .movie-subtitle {
display:flex;
align-items:center;
gap:4px;
width:100%;
}

.site-header .header-inner .movie-subtitle .subtitle-line {
background-color:#fff;
flex-grow: 1;
max-width: 84px;
height: 1px;
flex-shrink: 0;
min-width: 24px;
}

.site-header .header-inner .movie-subtitle .subtitle-text {
font-size:14px;
color:#fff;
text-align:center;
line-height:1.5;
word-break: break-all;
}

.site-header .header-note {
display:flex;
align-items:center;
justify-content:center;
gap:6px;
background-color:#e61e0f;
max-width: 760px;
width:100%;
color:#fff;
padding: 4px 0 2px;
border-radius: 3px;
font-size:13px;
text-decoration:none;
}

.site-header .header-note .header-note-icon {
font-size:10px;
line-height:1;
}

.site-header .step-indicator {
display:flex;
justify-content:center;
align-items:flex-start;
width:100%;
padding:0 16px;
}

.site-header .step-indicator .step {
display:flex;
flex-direction:column;
align-items:center;
gap:6px;
min-width:60px;
}

.site-header .step-indicator .step .step-num {
display:flex;
align-items:center;
justify-content:center;
width:38px;
height:38px;
border-radius:50%;
font-size:20px;
font-weight:bold;
}

.site-header .step-indicator .step .step-label {
font-size:12px;
}

.site-header .step-indicator .step.step--active .step-num {
background-color:#e61e0f;
color:#fff;
}

.site-header .step-indicator .step.step--active .step-label {
color:#fff;
}

.site-header .step-indicator .step.step--inactive .step-num {
background-color:#444;
color:#888;
}

.site-header .step-indicator .step.step--inactive .step-label {
color:#888;
}

.site-header .step-indicator .step-line {
width:40px;
height:1px;
background-color:#999;
margin:0 4px;
margin-top:19px;
}

.main-content {
margin-top:-46px;
position:relative;
z-index:1;
padding-bottom:120px;
}

.main-content .container {
max-width:760px;
margin:0 auto;
display:flex;
flex-direction:column;
gap:16px;
padding:0 16px;
}

.main-content .container .section {
background-color:#ffffff;
padding: 24px 16px;
border:1px solid #000000;
box-shadow: 2px 2px 0 #000000;
border-radius:12px;
display:flex;
flex-direction:column;
gap:16px;
}

.main-content .container .section:nth-child(even) {
background-color:#fefae5;
}

.main-content .container .section .section-title {
display:flex;
align-items:center;
gap:10px;
font-size:16px;
font-weight:bold;
color:#000;
}

.main-content .container .section .section-title::before {
content:"";
display:block;
width:5px;
height:22px;
min-width:5px;
background-color:#e61e0f;
border-radius:50px;
}

.main-content .container .section .info-cards {
display:flex;
flex-direction:column;
gap: 8px;
padding-top:0;
}

.main-content .container .section .info-cards .info-card {
background-color:#fff;
margin-top:-1px;
display:flex;
flex-direction:column;
gap:8px;
}

.main-content .container .section .info-cards .info-card:not(:first-child) {
border-top: 1px dashed #000C32;
padding-top: 8px;
}

.main-content .container .section .info-cards .info-card:first-child {
margin-top:0;
}

.main-content .container .section .info-cards .info-card .card-header {
display:flex;
align-items:center;
justify-content: center;
gap:8px;
}
.main-content .container .section .info-cards .info-card .card-header .card-icon {
width: auto;
height: 48px;
}
.main-content .container .section .info-cards .info-card .card-header .card-icon img {
height: 100%;
}

.main-content .container .section .info-cards .info-card .card-header .card-title {
font-size:15px;
font-weight:bold;
color:#000;
line-height:1.4;
text-align:center;
}

.main-content .container .section .info-cards .info-card .card-desc {
font-size:12px;
color:#000;
line-height:1.7;
text-align: center;
}

.main-content .container .section .notice-list {
list-style:none;
display:flex;
flex-direction:column;
gap:4px;
}

.main-content .container .section .notice-list .notice-item {
display:flex;
gap:2px;
font-size:12px;
line-height:1.7;
}

.main-content .container .section .notice-list .notice-item.notice-item--red {
color:#e61e0f;
}

.main-content .container .section .notice-list .notice-item .bullet {
flex-shrink:0;
font-size:13px;
font-weight:700;
}

.main-content .container .section .terms-list {
list-style:none;
display:flex;
flex-direction:column;
gap:8px;
}

.main-content .container .section .terms-list li {
display:flex;
gap:2px;
font-size:12px;
line-height:1.7;
}

.main-content .container .section .terms-list li .num {
flex-shrink:0;
width:20px;
min-width:20px;
font-size:13px;
font-weight:700;
}

.main-content .container .section .consent-list {
list-style:none;
display:flex;
flex-direction:column;
gap:12px;
}

.main-content .container .section .consent-list .consent-item {
display:block;
}

.main-content .container .section .consent-list .consent-item .consent-label {
display:flex;
align-items:flex-start;
gap:10px;
cursor:pointer;
}

.main-content .container .section .consent-list .consent-item .consent-label .consent-check {
position:absolute;
opacity:0;
width:0;
height:0;
}

.main-content .container .section .consent-list .consent-item .consent-label .consent-box {
width:32px;
height:32px;
border: solid 1.5px #dfdfdf ;
background-color: #dfdfdf ;
border-radius: 8px;
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
}

.main-content .container .section .consent-list .consent-item .consent-label .consent-box .consent-check-icon {
background: url(../img/svg/check_white.svg) no-repeat center !important;
width: 26px;
height: 22px;
}

.main-content .container .section .consent-list .consent-item .consent-label .consent-check:checked + .consent-box {
background-color:#333333;
border-color:#333333;
}

.main-content .container .section .consent-list .consent-item .consent-label .consent-check:checked + .consent-box {
    background-color: #fff;
    border: solid 1.5px #000C32 !important;;
}
.main-content .container .section .consent-list .consent-item .consent-label .consent-check:checked + .consent-box .consent-check-icon {
background: url(../img/svg/check_red.svg) no-repeat center !important;
width: 26px;
height: 22px;
}

.main-content .container .section .consent-list .consent-item .consent-label .consent-text {
font-size:15px;
line-height:1.6;
margin-top: 3px;
}

.main-content .container .section .form-desc {
font-size:13px;
color:#000;
}

.main-content .container .section .entry-form .form-row {
display:flex;
flex-direction:column;
gap:6px;
padding:12px 0;
}

.main-content .container .section .entry-form .form-row .form-label-wrap {
display:flex;
align-items:center;
gap:8px;
}

.main-content .container .section .entry-form .form-row .form-label-wrap .form-label {
font-size:14px;
font-weight:bold;
color:#000;
}

.main-content .container .section .entry-form .form-row .form-label-wrap .badge-required {
background-color:#e61e0f;
color:#fff;
border-radius: 3px;
font-size:9px;
padding:2px 5px;
flex-shrink:0;
}

.main-content .container .section .entry-form .form-row .form-input-wrap {
flex:1;
}

.main-content .container .section .entry-form .form-row .form-input-wrap.form-input-wrap--split {
display:flex;
gap:8px;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .form-input {
width:100%;
height:44px;
border:1px solid #ccc;
border-radius: 6px;
padding:0 12px;
font-size:16px;
color:#000;
background-color:#fff;
appearance:none;
-webkit-appearance:none;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .form-input::placeholder {
color:#999;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .form-input:focus {
outline:2px solid #333;
outline-offset:-1px;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .form-input.form-input--tel {
width:90px;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .form-input.form-input--zip {
width:90px;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .form-note {
font-size:12px;
margin-top:8px;
line-height:1.7;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .form-note.form-note--red {
color:#e61e0f;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .select-wrap {
position:relative;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .select-wrap::after {
content:"▼";
position:absolute;
right:12px;
top:50%;
transform:translateY(-50%);
font-size:10px;
pointer-events:none;
color:#555;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .select-wrap .form-select {
width:100%;
height:44px;
border:1px solid #ccc;
padding:0 32px 0 16px;
border-radius: 6px;
font-size:16px;
color:#000;
background-color:#fff;
appearance:none;
-webkit-appearance:none;
cursor:pointer;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .select-wrap .form-select:focus {
outline:2px solid #333;
outline-offset:-1px;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .phone-wrap {
display:flex;
align-items:center;
gap:4px;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .phone-wrap .separator {
font-size:16px;
color:#000;
flex-shrink:0;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .radio-group {
display:flex;
gap:6px;
flex-wrap:wrap;
padding-top:2px;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .radio-group .radio-label {
display:flex;
align-items:center;
gap:4px;
font-size:14px;
cursor:pointer;
border:1px solid #ccc;
border-radius: 6px;
padding:8px 10px;
background-color:#fff;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .radio-group .radio-label input[type="radio"] {
display:none;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .radio-group .radio-label .radio-custom {
width:16px;
height:16px;
border:2px solid #999;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .radio-group .radio-label input[type="radio"]:checked + .radio-custom {
border-color:#e61e0f;
}

.main-content .container .section .entry-form .form-row .form-input-wrap .radio-group .radio-label input[type="radio"]:checked + .radio-custom::after {
content:"";
width:8px;
height:8px;
border-radius:50%;
background-color:#e61e0f;
}

.main-content .btn-area {
max-width:560px;
margin:48px auto 0;
padding:0 16px;
display:flex;
flex-direction:column;
gap:16px;
}

.main-content .btn-area .btn-area-heading {
text-align:center;
font-size:16px;
font-weight:bold;
color:#e61e0f;
}

.main-content .btn-area .btn-x {
display:flex;
align-items:center;
justify-content:center;
background-color:#cacaca;
border-radius: 12px;
color:#f2f2f2;
font-size:18px;
font-weight:bold;
padding:18px 24px;
text-decoration:none;
width:100%;
pointer-events:none;
}

.main-content .btn-area .btn-x.is-active {
background-color:#000000;
color:#ffffff;
pointer-events:auto;
}

.main-content .btn-area .btn-x.is-active::after {
color:#e61e0f;
}

.main-content .btn-area .btn-x.is-active:hover {
background-color:#222222;
}

.main-content .btn-area .btn-notes {
display:flex;
flex-direction:column;
gap:8px;
}

.main-content .btn-area .btn-notes .btn-note {
display:flex;
gap:4px;
font-size:12px;
line-height:1.7;
}

.main-content .btn-area .btn-notes .btn-note.btn-note--red {
color:#e61e0f;
}

.main-content .btn-area .btn-mail {
display:flex;
align-items:center;
justify-content:center;
background-color:#d7b9b7;
color:#f2f2f2;
border-radius: 12px;
font-size:18px;
font-weight:bold;
padding:18px 24px;
text-decoration:none;
width:100%;
pointer-events:none;
}

.main-content .btn-area .btn-mail.is-active {
background-color:#e61e0f;
color:#ffffff;
pointer-events:auto;
}

.main-content .btn-area .btn-mail.is-active:hover {
background-color:#cc1a0d;
}

.main-content .form-submit .btn-submit {
display:flex;
align-items:center;
justify-content:center;
gap:8px;
background-color:#e61e0f;
border-radius: 12px;
color:#fff;
font-size:16px;
font-weight:bold;
padding:18px 24px;
border:none;
cursor:pointer;
width:100%;
max-width:560px;
margin:0 auto;
}

.main-content .form-submit .btn-submit:hover {
    opacity: .8;
}

.main-content .form-submit .btn-back {
display:flex;
align-items:center;
justify-content:center;
gap:8px;
background-color:#fff;
border: 1px solid #ccc;
border-radius: 12px;
color:#333;
font-size:16px;
font-weight:bold;
padding:12px 24px;
border:none;
cursor:pointer;
width:100%;
max-width:560px;
margin:0 auto;
}

.main-content .form-submit .btn-back:hover {
    opacity: .8;
}

.main-content .security-note {
font-size:12px;
color:#000;
margin-top:16px;
display:flex;
gap:4px;
line-height:1.7;
padding:0 16px;
max-width:760px;
margin-left:auto;
margin-right:auto;
}

.main-content .security-note .note-mark {
flex-shrink:0;
}

.site-footer {
background-color:#999999;
padding:16px;
text-align:center;
}

.site-footer .powered-by {
color:#fff;
font-size:12px;
}

@media (min-width:768px) {

.pc {
    display: block;
}
.sp {
    display: none;
}

.site-header .header-inner {
max-width:760px;
padding:0;
}
.site-header .header-inner .movie-title {
font-size:30px;
}
.site-header .header-inner .movie-subtitle .subtitle-text {
font-size:16px;
}
.site-header .step-indicator .step-line {
width:80px;
}

.main-content .container {
padding:0;
}
.main-content .container .section {
padding:24px 32px;
}
.main-content .container .section .section-title {
font-size:20px;
}

.main-content .container .section .info-cards {
flex-direction:row;
}
.main-content .container .section .info-cards .info-card {
flex:1;
margin-top:0;
margin-left:-1px;
}
.main-content .container .section .info-cards .info-card:first-child {
margin-left:0;
}
.main-content .container .section .info-cards .info-card:not(:first-child) {
border-left: 1px dashed #000C32;
padding-left: 8px;
border-top: none;
padding-top: 0;
}
.main-content .container .section .info-cards .info-card .card-header {
    flex-direction: column-reverse;
}
.main-content .container .section .info-cards .info-card .card-header .card-icon {
    width: auto;
    height: 58px;
}
.main-content .container .section .info-cards .info-card .card-header .card-icon img {
    height: 100%;
}

.main-content .container .section .entry-form .form-row {
flex-direction:row;
align-items:flex-start;
gap:16px;
padding:14px 0;
}
.main-content .container .section .entry-form .form-row .form-label-wrap {
min-width:180px;
padding-top:10px;
flex-shrink:0;
}
.main-content .container .section .entry-form .form-row .form-input-wrap .form-input.form-input--tel {
width:130px;
}
.main-content .container .section .entry-form .form-row .form-input-wrap .form-input.form-input--zip {
width:130px;
}
.main-content .container .section .entry-form .form-row .form-input-wrap .radio-group {
flex-direction:row;
}

.main-content .btn-area {
padding:0;
}
.main-content .form-submit {
padding:0;
}
.main-content .security-note {
padding:0;
}

}