@charset "UTF-8";
/* CSS Document */

/*************************************************************************************************************************
* reset
*************************************************************************************************************************/
html { height: 100%; overflow-y: scroll; }
body { height: 100%; margin: 0; padding: 0; font-family: YakuHanJP_Noto, 'Noto Sans JP', sans-serif; text-align: justify; text-justify: inter-ideograph; -webkit-text-size-adjust: 100%; -webkit-font-feature-settings: 'palt' 1; font-feature-settings: 'palt' 1; }
img { width: 100%; max-width: 100%; height: auto; border: 0; vertical-align: bottom; }
svg { vertical-align: bottom; }
form { margin: 0; padding: 0; }
p { margin: 0; padding: 0; }
a, a:hover { text-decoration: none; outline: none; }
h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; font-size: 0; line-height: 0; }
ul, ol, dl, dt, dd { margin: 0; padding: 0; }
li { margin: 0; padding: 0; list-style: none; }
table { border: 0; border-collapse: collapse; border-spacing: 0; }
caption, th { text-align: left; }
header, nav, main, article, aside, section, footer { display: block; }
* { box-sizing: border-box; }
figure { margin: 0; padding: 0; }


/*************************************************************************************************************************
* common
*************************************************************************************************************************/
html { font-weight: 500; font-size: 14px; color: #000; line-height: 1.75; }


@media print, screen and (min-width:681px) {
  html { font-size: 15px; }
}



/*************************************************************************************************************************
* header
*************************************************************************************************************************/
.header { display: flex; align-items: center; height: 48px; padding: 0 10px; }
.header__ttl { display: flex; align-items: center; font-size: 10px; font-weight: 900; color: #000; line-height: 1.4; }
.header__ttl::before { display: block; content: ""; width: 20px; height: 27px; margin: 0 10px 0 0; background: url("../img/logo_mark.svg") no-repeat left top/cover; }
@media print, screen and (min-width:681px) {
  .header { height: 70px; padding: 0 20px; }
  .header__ttl { font-size: 12px; }
  .header__ttl br { display: none; }
  .header__ttl::before { display: block; content: ""; width: 110px; height: 31px; margin: 0 50px 0 0; background: url("../img/logo.svg") no-repeat left top/cover; }
}



/*************************************************************************************************************************
* step
*************************************************************************************************************************/
.step__ttl { display: flex; align-items: center; background: #feff41; height: 50px; padding: 0 18px; font-weight: 700; font-size: 15px; line-height: 1; color: #000; }
.step-list { display: flex; overflow: hidden; }
.step-list__item { display: flex; justify-content: center; align-items: center; background: #e6e6e6; width: 33.3%; height: 50px; padding: 0 0 0 15px; position: relative; font-weight: 700; font-size: 12px; line-height: 1.5; color: #000; }
.step-list__item:nth-child(1) { z-index: 4; padding-left: 0; }
.step-list__item:nth-child(2) { z-index: 3; }
.step-list__item:nth-child(3) { z-index: 2; }
.step-list__item::before,
.step-list__item::after { content: ""; width: 0; height: 0; position: absolute; top: 50%; border-width: 39px 0 39px 11px; border-style: solid; transform: translateY(-50%); }
.step-list__item::before { right: -13px; border-color: transparent transparent transparent #fff; }
.step-list__item::after { right: -11px; border-color: transparent transparent transparent #e6e6e6; }
.step-list__item--on { background: #ff9900; color: #fff; }
.step-list__item--on::after { border-color: transparent transparent transparent #ff9900; }
.step-list__pc-txt { display: none; }

@media print, screen and (min-width:681px) {
  .step__ttl { height: 85px; padding: 0 40px; font-size: 20px; }
  .step-list__item { justify-content: flex-start; height: 75px; padding-left: 50px; font-size: 13px; }
  .step-list__item:nth-child(1) { padding-left: 30px; }
  .step-list__item::before,
  .step-list__item::after { border-width: 48px 0 48px 18px; }
  .step-list__item::before { right: -20px; }
  .step-list__item::after { right: -18px; }
  .step-list__num { font-size: 12px; }
  .step-list__pc-txt { display: inline; }
}



/*************************************************************************************************************************
* contents
*************************************************************************************************************************/
.contents { padding: 40px 20px 60px; }
.contents--pre { padding: 30px 20px 30px; }

.lead { margin: 0 0 15px 0; font-size: 14px; }
.lead--under-main-ttl { margin-top: 12px; font-size: 14px; line-height: 1.7142; }

.cmn-txt { font-size: 14px; font-weight: 400; line-height: 1.714; }
.under-main-ttl { margin-top: 20px; }
.attention { font-size: 14px; color: #ed1c24; }
.attention02 { margin: 20px 0 0; font-weight: 700; font-size: 14px; color: #ed1c24; }
.main-ttl { border-left: 4px solid #ff9900; padding: 9px 0 11px 14px; font-size: 16px; font-weight: 700; line-height: 1; }
.category { background: rgba(255,153,0,0.4); margin: 40px 0 0; padding: 12px 15px; font-weight: 700; font-size: 14px; line-height: 1.5; color: #000; }
.category:first-of-type { margin-top: 30px; }
.category:last-of-type { margin-top: 34px; }
.category::after { transform: translateY(-1px); display: inline-flex; justify-content: center; align-items: center; width: 29px; height: 16px; background: #0071bc; border-radius: 3px; margin-left: 4px; padding-bottom: 2px; font-size: 10px; font-weight: 700; line-height: 1; text-align: center; color: #fff; content: "任意"; }
.category--req::after { background: #ed1c24; content: "必須"; }
/*
.block { background-image: linear-gradient(to right, #A4A4A4, #A4A4A4 2px, transparent 2px, transparent 4px); background-repeat: repeat-x; background-size: 4px 1px; margin: 20px 0 0; padding: 1px 0 0; }
.block:first-of-type,.block.bordernone { background: none; margin-top: 0; padding-top: 0; }
*/
.block:not(:last-of-type) { margin-bottom: 0; }
.note { margin: 7px 0 0; font-size: 11px; line-height: 1.5; color: #999; }
.mail-confirm { margin: 10px 0 -5px; font-size: 11px; line-height: 1.5; }
.subttl { margin: 20px 0 0; font-weight: 700; font-size: 14px; line-height: 1.5; }

@media print, screen and (min-width:681px) {
  .contents { max-width: 880px; margin: 0 auto; padding: 50px 40px 80px; }
  
  .lead { margin-bottom: 20px; font-size: 14px; }
  .attention {}
  .attention02 { margin-top: 30px; }
  .category { margin-top: 50px; padding: 15px 20px; font-size: 15px; }
  .block { margin-top: 30px; }
  .subttl { margin-top: 30px; }
}



/* form
*************************************************************************************************************************/
.upper-input { margin-bottom: 16px; }

input,
textarea,
select { border: none; border-radius: 0; -webkit-appearance: none; font: 500 14px/1.75 YakuHanJP_Noto, 'Noto Sans JP', sans-serif; text-align: left; }
input[type=radio],
input[type=checkbox] { display: none; }

@media print, screen and (min-width: 681px) {
  input,
  textarea,
  select { font-size: 15px; }
}


/* textbox */
.text { background: #fff; width: 100%; height: 42px; margin: 0 0 0; padding: 0 12px; border: 2px solid #bfbfbf; border-radius: 3px; }

@media print, screen and (min-width: 681px) {
  .text { padding: 0 18px; }
  .text:first-of-type { margin-top: 0; }
  .text--320 { width: calc(50% - 10px); margin: 0 0 0 20px; }
  .text--320:first-child { margin-left: 0; }
  .text--500 { width: 100%; max-width: 500px; }
  .text--580 { width: 100%; max-width: 580px; }
  .text--100p { width: 100%; }
}


/* textarea */
.textarea { display: block; background: #f8f8f8; width: 100%; height: 250px; margin: 20px 0 0; padding: 12px; border: 2px solid #bfbfbf; border-radius: 3px; }
.text__count { margin: 5px 0 0; font-size: 13px; line-height: 1.5; color: #ff0000; text-align: right; }

@media print, screen and (min-width: 540px) {
  .textarea__cap { display: flex; justify-content: space-between; }
  .textarea__cap .err__txt { width: calc(100% - 200px); }
  .text__count { width: 180px; }
}

@media print, screen and (min-width: 681px) {
  .textarea { height: 420px; margin-top: 30px 0 0; padding: 18px; }
}


/* selectbox */
.select__wrap { background: #f8f8f8; width: 100%; margin: 20px 0 0; position: relative; border-radius: 3px; overflow: hidden; z-index: 2; }
.select__wrap::before,
.select__wrap::after { position: absolute; content: ""; pointer-events: none; }
.select__wrap::before { top: 0; right: -2px; width: 42px; height: 100%; background: #000; border-radius: 0 3px 3px 0; z-index: 0; }
.select__wrap::after { width: 0; height: 0; top: 50%; right: 16px; border-style: solid; border-width: 6px 4px 0 4px; border-color: #fff transparent transparent transparent; transform: translateY(-50%); z-index: 10; }
.select__wrap select { background: transparent; width: 110%; height: 38px; border: 2px solid #bfbfbf; padding: 0 0 0 12px; color: #000 !important; }

@media print, screen and (min-width: 681px) {
  .select__wrap:first-of-type { margin-top: 0; }
  .select__wrap select { padding-left: 18px; }
  .select__wrap--200 { width: 200px; }
  .select__wrap--300 { width: 300px; }
  
}


/* checkbox - date */
.type { display: flex; flex-wrap: wrap; width: 100%; margin: 0 0 20px 0; }
.type__item { width: calc((100% / 2) - 6px); margin: 9px 9px 0 0; }
.type__item:nth-child(-n+2) { margin-top: 0; }
.type__item:nth-child(2n) { margin-right: 0; }
.type__item label { display: flex; justify-content: center; align-items: center; height: 50px; border: 2px solid #000; border-radius: 3px; cursor: pointer; }
.type__item input[type=radio]:checked + label { background-color: #000; border-color: #000; color: #fff; }
.type__item input[type=radio]:checked + label span { color: #fff; }
.date--sat { color: #008aaa; }
.date--sun { color: #e7007d; }

@media print, screen and (min-width: 681px) {
  .type__item { width: calc(25% - 12px); margin: 0 15px 0 0; }
  .type__item:nth-child(2n) { margin-right: 15px; }
  .type__item:nth-child(4n) { margin-right: 0; }
}


/* radio */
.radio + label { display: inline-block; padding: 0 0 0 20px; position:relative; line-height: 1.5; cursor: pointer; }
.radio + label::before { display: block; content: ""; width: 15px; height: 15px; position: absolute; top: 4px; left: 0; border: 2px solid #b3b3b3; border-radius: 50%; box-sizing: border-box; }
/*.radio:checked + label::before { border-color: #000; }*/
.radio:checked + label::after { content: ""; display: block; background: #ed1c24; width: 5px; height: 5px; position: absolute; top: 9px; left: 5px; border-radius: 50%; box-sizing: border-box; }


@media print, screen and (min-width: 681px) {
  .radio + label::before { left: 0!important; }
  .radio:checked + label::after { left: 5px!important; }
}

/* check */
.check { display: none; }
.check + label,
.radiochk { display: flex; align-items: center; width: 100%; height: 42px; background: #f1f1f1; padding: 0 15px 0 10px; border-radius: 3px; cursor: pointer; position: relative; }
.check + label::before,
.radiochk::before { display: inline-block; content: ""; width: 12px; height: 12px; margin: 0 6px 0 0; border: 2px solid #bfbfbf; border-radius: 3px; position: relative; transition: all .3s; }

.check:checked + label,
.radiochk-wrap:checked + label { background-color: #000; color: #fff; }
.check:checked + label::before,
.radiochk-wrap:checked + label::before { background-color: #fff; border: 2px solid #fff; }
.check:checked + label span::before,
.radiochk-wrap:checked + label span::before { display: inline-block; content: ""; width: 3px; height: 16px; background: #000; border-radius: 3px; transform: rotate(-135deg); box-shadow: 0 0 0 1.4px #fff; position: absolute; top: 26px; left: 17px; animation: check2 .4s ease 0s forwards; transform-origin: left top; }
.check:checked + label span::after,
.radiochk-wrap:checked + label span::after { display: inline-block; content: ""; width: 3px; height: 8px; background: #000; border-radius: 3px; transform: rotate(-45deg); position: absolute; top: 20px; left: 10px; animation: check1 .4s ease 0s forwards; transform-origin: left top; }


.radiochk { display: flex !important; align-items: center !important; }


@keyframes check1 {
  0% { height: 0; }
  100% { height: 8px; }
}
@keyframes check2 {
  0% { height: 0; }
  50% { height: 0; }
  100% { height: 16px; }
}


/* submit */
.submit { margin-top: 40px; text-align: center; }
.submit--mtlesser { margin-top: 20px; }
.submit__btn { display: flex; justify-content: center; align-items: center; background: #ff9900; width: calc(100% - 40px); max-width: 350px; height: 50px; margin: 0 auto; border-radius: 10px; font-weight: 700; font-size: 15px; color: #fff; cursor: pointer; transition: .3s; }
.submit__btn:hover { background: #000; color: #fff; }
/*.submit__btn::before { display: inline-block; content: ""; background: url("../img/ico_arrow_ov.svg") no-repeat 0 0/contain; width: 15px; height: 15px; margin: 0 8px 0 0; vertical-align: middle; }*/
.submit__btn:hover::before { background: url("../img/ico_arrow.svg") no-repeat 0 0/contain; }
.submit__back { display: inline-block; margin: 20px 0 0; font-weight: 700; color: #808080; text-decoration: underline; transition: .3s}
.submit__back:hover { color: #008aaa; text-decoration: underline; }

.submit--skip { margin-top: 24px; padding-bottom: 10px; }
.submit--skip .submit__btn { height: 72px; font-size: 15px; line-height: 1.46666; }
.submit__btn.disable { pointer-events: none; background: #ccc; }
@media print, screen and (min-width: 681px) {
  .submit { margin-top: 50px; padding-top: 50px; }
	.submit--mtlesser { margin-top: 20px; padding-top: 0; }
	.submit--skip { padding-top: 0; }
}

/* back */
.back { background-image: linear-gradient(to right, #A4A4A4, #A4A4A4 2px, transparent 2px, transparent 4px); background-repeat: repeat-x; background-size: 4px 1px; margin: 17px 0 0; padding-top: 32px; text-align: center; }
.back__btn { display: flex; justify-content: center; align-items: center; background: #666; width: calc(100% - 40px); max-width: 350px; height: 50px; margin: 0 auto; border-radius: 10px; font-weight: 700; font-size: 15px; color: #fff; cursor: pointer; transition: .3s; }
.back__btn:hover { background: #000; color: #fff; }
/*.back__btn::before { display: inline-block; content: ""; background: url("../img/ico_arrow_ov.svg") no-repeat 0 0/contain; width: 15px; height: 15px; margin: 0 8px 0 0; vertical-align: middle; }*/
.back__btn:hover::before { background: url("../img/ico_arrow.svg") no-repeat 0 0/contain; }
.back__back { display: inline-block; margin: 20px 0 0; font-weight: 700; color: #808080; text-decoration: underline; transition: .3s}
.back__back:hover { color: #008aaa; text-decoration: underline; }

@media print, screen and (min-width: 681px) {
  .back { margin-top: 50px; }
}


/* placeholder */
::-webkit-input-placeholder { line-height: 1.75; color: #b3b3b3; }
:-ms-input-placeholder { line-height: 1.75; color: #b3b3b3; }
::-ms-input-placeholder { line-height: 1.75; color: #b3b3b3; }
::-moz-placeholder { line-height: 1.75!important; color: #b3b3b3; }
::placeholder { line-height: 1.75; color: #b3b3b3; }

:focus::-webkit-input-placeholder { color: transparent; }
:focus:-ms-input-placeholder { color: transparent; }
:focus::-ms-input-placeholder { color: transparent; }
:focus::-moz-placeholder { color: transparent; }
:focus::placeholder { color: transparent; }



/* error */
.err__head { background: #ed1c24; margin: 30px 0 0; padding: 15px; color: #fff; text-align: center; }
.err__txt { margin: 5px 0 0; line-height: 1.3; color: #ed1c24; }
.err__style { border-color: #ed1c24 !important; }

@media print, screen and (min-width: 681px) {
  .err__head { margin-top: 50px; }
  .err__txt { margin-top: 10px; width: 100%; }
}


/* form items */
.item { margin: 20px 0 0; flex-wrap: wrap; }

.item__ttl { display: flex; align-items: center; font-weight: 700; line-height: 1; }
.item__required { display: flex; justify-content: center; align-items: center; background: #cc2d52; width: 28px; height: 16px; margin: 0 10px 0 0; border-radius: 4px; font-size: 10px; line-height: 1; color: #fff; }
.item__info { width: 100%; }
.item label small { font-size: 11px; }

.text-wrap { height: 0; overflow: hidden; transition: .3s; }
.text-wrap.open { height: auto; overflow: visible; margin-top: 15px; }
@media print, screen and (max-width: 680px) {
	.item--maison { border-bottom: 1px dashed #a4a4a4; padding-bottom: 20px; }
	.item__info--name { display: flex; justify-content: space-between; }
	.item__info--name .text { width: calc(50% - 7px); }
}
@media print, screen and (min-width: 681px) {
  .item { display: flex; flex-wrap: wrap; align-items: flex-start; }
  .item:first-of-type { margin-top: 30px; }
  .item__ttl { width: 180px; margin: 14px 0 0; padding: 0 0 0 38px; position: relative; }
  .item__required { margin: 0; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
  .item__info { display: flex; flex-wrap: wrap; width: calc(100% - 180px); }
	.item__info--from { width: 100%; }
	.text-wrap input { height: 38px; }
	.text-wrap.open { flex: 1; margin-left: 20px; }
	.text-wrap--abroad { margin-top: 0 !important; }
	
	.item--maison .item__ttl { margin-top: 0; line-height: 1.3; }
}


/* gender */
.gender__item:not(:last-of-type) { margin-right: 30px; }
.gender__item .radio + label { display: flex; align-items: center; width: 100%; height: 36px; padding: 0 0 0 24px; }
.gender__item .radio + label::before { top: 50%; left: 0; transform: translateY(-45%); }
/*.gender__item .radio:checked + label { border: 2px solid #000; }*/
.gender__item .radio:checked + label::after { top: 50%; left: 5px; transform: translateY(-40%); }

@media print, screen and (max-width: 680px) {
	.gender { display: flex; border-top: 1px dashed #a4a4a4; border-bottom: 1px dashed #a4a4a4; margin-top: 10px; padding-top: 10px; padding-bottom: 10px; }
}
@media print, screen and (min-width: 681px) {
  .gender { display: flex; }
  .gender__item { margin: 7px 0 0; }
  .gender__item .radio + label { width: auto; height: auto; margin: 0 40px 0 0; padding: 0 0 0 20px; border: none; }
  .gender__item .radio:checked + label { border: none; }
}


/* date of birh */
.dob { display: flex; margin: 10px 0 0; }
.dob__item { display: flex; align-items: center; margin: 0 15px 0 0; }
.dob__item:nth-child(1) { max-width: 127px; }
.dob__item:nth-child(2),
.dob__item:nth-child(3) { max-width: 104px; }
.dob__item:nth-child(3) { margin-right: 0; }
.dob__item input { margin: 0 5px 0 0; }

@media print, screen and (max-width: 340px) {
  .dob__item { margin-right: 8px; }
}

@media print, screen and (min-width: 681px) {
  .dob { margin-top: 0; }
  .dob__item { margin-right: 30px; }
  .dob__item:nth-child(1) { max-width: 195px; }
  .dob__item:nth-child(2),
  .dob__item:nth-child(3) { max-width: 150px; }
}

/* postcode */
.postcode { display: flex; flex-wrap: nowrap; margin: 10px 0 0; }
.postcode__item:nth-child(1) { max-width: 80px; margin: 0 20px 0 0; position: relative; }
.postcode__item:nth-child(1)::after { content: ""; background: #000; width: 10px; height: 1px; position: absolute; top: 50%; right: -15px; transform: translateY(-50%); }
.postcode__item:nth-child(2) { max-width: 90px; margin: 0 15px 0 0; }
.postcode__item input { margin-top: 0; }
.postcode__item:nth-child(3) { width: 120px; margin: 0; }
.postcode__item:nth-child(3) a { display: flex; justify-content: center; align-items: center; background: #000; height: 42px; border-radius: 3px; font-size: 13px; color: #fff; border: 2px solid #000; transition: .3s; }
.postcode__item:nth-child(3) a:hover { background: #000; color: #fff; }


@media print, screen and (min-width: 446px) {
  .postcode__item:nth-child(1) { max-width: 100px; margin: 0 33px 0 0; }
  .postcode__item:nth-child(1)::after { right: -21px; }
  .postcode__item:nth-child(2) { max-width: 120px; }
  .postcode__item:nth-child(3) { margin-top: 0; }
}

@media print, screen and (min-width: 681px) {
  .postcode { margin-top: 0; }
  .postcode__item:nth-child(2) { margin-right: 25px; }
}


/* detail*/
.detail { display: flex; width: 100%; }
.detail__item { margin: 0 10px 0 0; }
.detail__item:nth-child(1) { width: 36%; }
.detail__item:nth-child(2) { width: 28%; }
.detail__item:nth-child(3) { width: 36%; margin-right: 0; }

@media print, screen and (max-width: 680px) {
	.detail__item:nth-child(1) { width: 100%; margin-right: 0; }
}
@media print, screen and (min-width: 681px) {
  .detail { max-width: 580px; }
  .detail__item { max-width: 180px; }
  .detail__item:nth-child(1),
  .detail__item:nth-child(2) { margin-right: 30px; }
}


/* approval */
.approval { margin: 15px 0 0; }
.approval__item { margin: 10px 0 0; }
.approval__box { height: 0; overflow: hidden; transition: .3s ease-out; }
.approval__inner { background: #f2f2f2; margin: 15px 0 10px; padding: 1px 20px 20px; overflow: hidden; }

@media print, screen and (min-width: 681px) {
  .approval { margin-top: 20px; }
  .approval__inner { padding: 1px 30px 30px; }
}


/* attribute */
.highschool { display: none; }
.graduate { display: none; }
.parents { display: none; }
.teacher { display: none; }


/* department */
.department,.publisher { display: flex; flex-wrap: wrap; }
.department__item,.publisher__item,.imp__item { width: 100%; margin: 0 0 10px 0; }

.publisher__item:last-of-type { max-height: 0; overflow: hidden; transition: max-height .3s; }
/*.publisher__item:nth-child(10) { max-height: 0; overflow: hidden; transition: max-height .3s; }*/
.publisher__item:last-of-type.open { max-height: 50px; }
.other { margin-top: 5px; }
@media print, screen and (min-width: 681px) {
  .department__item,.publisher__item,.imp__item { width: calc((100% - 20px)/3); margin: 0 10px 10px 0; }
  .department__item:nth-child(3n),.publisher__item:nth-child(3n),.imp__item:nth-child(3n) { margin: 0 0 10px 0; }
  
  .publisher__item:last-of-type { width: 0; max-height: 50px; margin: 0; transition: width .5s; }
  .publisher__item:last-of-type.open { width: calc(100% - 270px); max-height: 50px; }
}


/* survey */
.survey { display: flex; justify-content: space-between; width: 100%; max-height: 0; margin: 5px 0 0 0; overflow: hidden; transition: max-height .3s; }
.survey.open { max-height: 50px; overflow: visible; }
.survey li { width: calc(20% - 4px); height: 42px; position: relative; }
.survey li .radio { width: 100%; height: 42px; margin: 0; padding: 0; opacity: 0; }
.survey li .radio + label { display: flex; align-items: center; justify-content: center; width: 100%; height: 42px; padding: 0; font-size: 10px; color: #000; text-align: center; line-height: 1.2; border: 2px solid #000; border-radius: 3px; position: absolute; top: 0; left: 0; transition: all .2s; }
.survey li .radio + label::before { display: none; }
.survey li .radio:checked + label::before { display: none; }
.survey li .radio:checked + label::after { display: none; }
.survey li .radio:checked + label { background: #000; font-weight: 700; color: #fff; line-height: 1.2; border-color: #000; border-radius: 3px; z-index: 3; }


.chk-contents .category { margin-bottom: 20px; }
.chk-contents .block { margin-top: 0; }
.chk-contents .item { margin-top: 0; }
.chk-contents .survey { margin-top: 10px; }
.chk-contents .survey.open { margin-bottom: 20px; }
@media print, screen and (min-width: 681px) {
  .survey li .radio + label { font-size: 13px; }
  .survey li .radio + label br { display: none; }
}




/*************************************************************************************************************************
* .preview
*************************************************************************************************************************/
.preview__text { margin: 20px 0 0; }
.preview-list__item { background-image: linear-gradient(to right, #A4A4A4, #A4A4A4 2px, transparent 2px, transparent 4px); background-repeat: repeat-x; background-size: 4px 1px; margin: 20px 0 0; padding: 20px 0 0; }
.preview-list__item:first-of-type { background: none; padding-top: 0; }
.preview-list__item span { display: block; margin:  0 0 5px; color: #999; }
.preview-list__item p::before { transform: translateY(-1px); display: inline-block; margin-right: 2px; font-size: 70%; color: #ff9900; content: "\025cf"; }
.preview-list__item--survey p { line-height: 1.4258; }
.preview-list__item--survey p:not(:last-of-type) { margin-bottom: 10px; }


@media print, screen and (min-width: 681px) {
  .preview__text { margin-top: 30px; }
  .preview-list__item { display: flex; }
  .preview-list__item:first-child { margin-top: 30px; }
  .preview-list__item span { width: 160px; margin-right: 30px; color: #000; }
}



/*************************************************************************************************************************
* step
*************************************************************************************************************************/
.applied {   background: rgba(255,153,0,0.4); margin: 0 0 0; padding: 16px 20px; text-align: center; }
.applied__ttl { font-weight: 700; font-size: 18px; line-height: 1; color: #000; letter-spacing: .5px; }
.applied__txt { background: #f2f2f2; margin: 15px 0 0; padding: 14px; font-weight: 900; font-size: 17px; line-height: 1; color: #008aaa; letter-spacing: 1px; }

.howto { margin: 15px 0 0; padding: 25px; border: 1px solid #ccc; font-size: 13px; }
.howto__sec:not(:first-of-type) { margin: 25px 0 0; }
.howto__ttl { margin: 0 0 10px; padding: 0 0 12px; border-bottom: 1px solid #ccc; font-weight: 500; font-size: 14px; line-height: 1; color: #008aaa; }
.howto__ttl::before { content: "■"; }
.howto-list__item { padding: 0 0 0 1em; position: relative; }
.howto-list__item::before { content: "※"; position: absolute; top: 0; left: 0; }
.howto-app { margin: 15px 0; }
.howto-app__item { margin: 10px 0 0; }
.howto-app__item a { display: flex; justify-content: center; align-items: center; height: 46px; border: 1px solid #ccc; border-radius: 23px; font-size: 13px; line-height: 1; color: #008aaa; transition: .3s; }
.howto-app__item a:hover { background: #008aaa; border-color: #008aaa; color: #fff; }
.howto-app__item a::before { display: inline-block; content: ""; width: 0; height: 0; margin: 0 6px 0 0; border-style: solid; border-width: 5px 0 5px 8px; border-color: transparent transparent transparent #008aaa; transition: .3s; }
.howto-app__item a:hover::before { border-color: transparent transparent transparent #fff; }

.caution { margin: 35px 0 0; }
.caution__item { padding: 0 0 0 1em; position: relative; }
.caution__item::before { content: "※"; position: absolute; top: 0; left: 0; }

.contact { margin: 35px 0 0; padding: 25px; border: 1px solid #ccc; }
.contact__ttl { margin: 0 0 10px; padding: 0 0 12px; border-bottom: 1px solid #ccc; font-weight: 500; font-size: 14px; line-height: 1; }
.contact__txt { font-size: 13px; }
.contact-list { margin: 20px 0 0; }
.contact-list__item { margin: 10px 0 0; }
.contact-list__item a { display: flex; justify-content: center; align-items: center; height: 88px; border: 1px solid #ccc; transition: .3s; }
.contact-list__item a:hover { border: 3px solid #008aaa; }
.contact__icon { width: 44px; margin: 0 12px 0 0; }
.contact-info { width: 180px; }
.contact-info__dt { font-size: 14px; line-height: 1; color: #333; letter-spacing: 1px; }
.contact-info__dd { margin: 5px 0 0; font-size: 0; line-height: 0; }
.contact-info__dd img { width: auto; height: 23px; }

@media print, screen and (max-width: 355px) {
  .applied__txt { font-size: 17px; }
  .contact-info { width: 150px; }
  .contact-info__dt { font-size: 12px;  letter-spacing: 0; }
}

@media print, screen and (min-width: 681px) {
  .applied { margin-bottom: 30px; padding: 35px; }
  .applied__ttl { font-size: 23px; }
  .applied__txt { margin-top: 30px; padding: 24px; font-size: 23px; }
  
  .howto { padding: 40px 40px 50px; font-size: 14px; }
  .howto__sec:not(:first-of-type) { margin-top: 35px; }
  .howto__ttl { font-size: 15px; }
  .howto-app { margin: 20px 0; }
  .howto-app__item a { display: flex; justify-content: center; align-items: center; height: 46px; border: 1px solid #ccc; border-radius: 23px; font-size: 13px; line-height: 1; color: #008aaa; transition: .3s; }
  .howto-app__item a:hover { background: #008aaa; border-color: #008aaa; color: #fff; }
  .howto-app__item a::before { display: inline-block; content: ""; width: 0; height: 0; margin: 0 6px 0 0; border-style: solid; border-width: 5px 0 5px 8px; border-color: transparent transparent transparent #008aaa; transition: .3s; }
  .howto-app__item a:hover::before { border-color: transparent transparent transparent #fff; }
  
  .caution { margin-top: 50px; }
  
  .contact { margin-top: 50px; padding: 40px 40px 50px; }
  .contact__ttl { font-size: 15px; }
  .contact__txt { font-size: 14px; }
  .contact-list { display: flex; justify-content: space-between; }
  .contact-list__item { width: calc(50% - 10px); margin-top: 0; }
}

@media print, screen and (min-width: 768px) {
  .howto-app { display: flex; justify-content: space-between; }
  .howto-app__item { width: calc((100% - 30px) / 3); margin-top: 0; }
  
  .contact-list__item a { height: 110px; }
  .contact__icon { width: 57px; margin-right: 12px; }
  .contact-info { width: auto; }
  .contact-info__dt { font-size: 15px; }
  .contact-info__dd { margin: 5px 0 0; }
  .contact-info__dd img { height: 28px; }
}



/*************************************************************************************************************************
* thanks
*************************************************************************************************************************/
.thanks__box { padding: 16px 16px 20px 16px; }
.thanks__box--thanks { padding-bottom: 0; }
.thanks__box-title { display: block; margin: 0 0 16px 0; padding: 16px; background: rgba(255,153,0,0.4); font-size: 16px; line-height: 1.5; text-align: center; border-radius: 5px; }
/*.thanks__box-title { display: block; margin: 0 0 16px 0; padding: 16px; background: #00507e; font-size: 16px; line-height: 1.5; color: #ffffff; border-radius: 5px; }*/
.thanks__box-text { margin: 0 0 25px 0; font-size: 14px; font-weight: 400; line-height: 1.714; letter-spacing: -0.02em; text-align: center; }
.thanks__box-caption { margin: 0 0 16px 0; padding: 18px 20px 15px; border: 1px solid #ccc; }
.thanks__box-caption dt { margin: 0 0 5px 0; font-size: 12px; line-height: 1.3; color: #333; font-weight: bold; }
.thanks__box-caption dd { margin: 0 0 3px 0; padding: 0 0 0 1.4em; font-size: 12px; line-height: 1.5; text-indent: -1.4em; }
.thanks__box-caption dd::before { content: "\025cf"; color: #ff9900; margin-right: 5px; }
.thanks__box-limit { display: block; margin: 0 0 30px 0; padding: 5px 10px; font-size: 13px; font-weight: bold; color: #ff9900; text-align: center; border: 2px solid #ff9900; }
.thanks__box-comment { display: block; margin: 0 0 14px 0; font-size: 14px; color: #000; text-align: center; }
.thanks__box-btn { display: flex; justify-content: center; align-items: center; height: 50px; background: #ff9900; font-size: 15px; font-weight: 700; color: #fff; line-height: 45px; text-align: center; border-radius: 10px; border: none; transition: all .2s; }
/*
.thanks__box-btn::after { display: block; content: ""; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff; position: absolute; top: 50%; right: 16px; transform: translateY(-50%) rotate(45deg); }
.thanks__box-btn::before { display: block; content: ""; width: 8px; height: 8px; border-top: 2px solid #c97505; border-right: 2px solid #c97505; position: absolute; top: calc(50% - 1px); right: 17px; transform: translateY(-50%) rotate(45deg); }
.thanks__box-btn:hover { background: #c97505; box-shadow: none; transform: translateY(5px); }
*/
.reconfirm__box { display: none; opacity: 0; width: 100%; height: 100vh; background: rgba(0,0,0,.8); position: fixed; top: 0; left: 0; z-index: 10000; }
.reconfirm__box dl { width: 90%; padding: 25px; background: #ffffff; border-radius: 5px; box-shadow:0px 0px 6px 3px rgba(0,0,0,.5); position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.reconfirm__box dl dt { margin: 0 0 20px 0; font-size: 14px; line-height: 1.5; }
.reconfirm__box dl dd ul { display: flex; }
.reconfirm__box dl dd ul li { width: calc(50% - 5px); margin: 0 10px 0 0; }
.reconfirm__box dl dd ul li:last-child { margin: 0; }
.reconfirm__box.open { display: block; opacity: 1; animation-name: boxFadeIn; animation-duration: .5s; }
@keyframes boxFadeIn {
  0%  { display: block; opacity:0; }
  100% { opacity:1; }
}
.reconfirm__box-btn-confirm { display: flex; justify-content: center; align-items: center; height: 45px; background: #ff9900; font-size: 16px; font-weight: 700; color: #fff; line-height: 1; text-align: center; border-radius: 10px; letter-spacing: 2px; border: none; position: relative; transition: all .2s; }/*box-shadow: 0px 5px 0px 0px #c97505; text-shadow: -1px -1px 0px #c97505;*/
/*
.reconfirm__box-btn-confirm::after { display: block; content: ""; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff; position: absolute; top: 50%; right: 16px; transform: translateY(-50%) rotate(45deg); }
.reconfirm__box-btn-confirm::before { display: block; content: ""; width: 8px; height: 8px; border-top: 2px solid #c97505; border-right: 2px solid #c97505; position: absolute; top: calc(50% - 1px); right: 17px; transform: translateY(-50%) rotate(45deg); }
.reconfirm__box-btn-confirm:hover { background: #c97505; box-shadow: none; transform: translateY(5px); }
*/
.reconfirm__box-btn-close { display: flex; justify-content: center; align-items: center; height: 45px; background: #a0a0a0; font-size: 16px; font-weight: 700; color: #fff; line-height: 1; text-align: center; border-radius: 10px; letter-spacing: 2px; border: none; transition: all .2s; }/* position: relative;box-shadow: 0px 5px 0px 0px #6b6b6b; text-shadow: -1px -1px 0px #6b6b6b;*/
/*.reconfirm__box-btn-close:hover { background: #6b6b6b; box-shadow: none; transform: translateY(5px); }*/


/*************************************************************************************************************************
* footer
*************************************************************************************************************************/
.footer { display: flex; justify-content: center; align-items: center; background: #e6e6e6; height: 40px; }
.footer__copyright { display: flex; justify-content: center; align-items: center; }
.footer__copyright img { width: 187px; line-height: 1; }

@media print, screen and (min-width: 681px) {
  .footer { height: 150px; }
}









/* show only  SP/PC
-------------------------------*/
.sp-only { display: none !important; }
.sp-only-2 { display: none !important; }
.pc-only { display: block !important; }
.pc-only-2 { display: inline-block !important; }

@media screen and (max-width: 680px) {
	.sp-only { display: block !important; }
	.sp-only-2 { display: inline-block !important; }
	.pc-only { display: none !important; }
	.pc-only-2 { display: none !important; }

}