/*--進行状況--*/
ul.progress { width: 100%; border-top: #DDD double 3px; display: flex; }
ul.progress li { width: 25%; height: 60px; color: #666; background: #AAA; border-right: #FFF solid 1px; text-align: center; position: relative; }
ul.progress li:last-child { border: none; }
ul.progress li::after { content: ""; width: 0; height: 0; border-color: transparent transparent transparent #AAA; border-width: 10px; border-style: solid; filter: drop-shadow(1.5px 0 0 rgba(255,255,255,1.0)); position: absolute; left: -1px; top: 20px; }
ul.progress li:first-child::after { border: none; }
ul.progress li span { padding-top: 1em; font-size: .8em; font-weight: normal; line-height: 1em; display: block; }
ul.progress li.on { color: #FFF; background: #49D; font-weight: bold; z-index: 2; }
ul.progress li.on::before { content: ""; width: 0; height: 0; border-color: transparent transparent transparent #49D; border-width: 10px; border-style: solid; filter: drop-shadow(1px 0 0 rgba(255,255,255,1.0)); position: absolute; right: -20px; top: 20px; }
ul.progress li.on:last-child::before { border: none; }
ul.progress li a { height: 60px; color: #06A; font-weight: bold; display: block; }
ul.progress li a:hover { color: #C44; }
/*--試用条件--*/
div.startplan { width: 90%; margin: 1em auto; }
div.startplan h3 { color: #49D; font-size: 1.2em; font-weight: bold; }
div.startplan p { text-align: center; }
div.startplan ul { display: flex; }
div.startplan li { width: 31%; margin: .5em 1%; border-radius: 1em; }
div.startplan li p { padding: 8em 1em .5em 1em; font-size: .8em; color: #444; }
div.startplan li a { color: #444; border-radius: 1em; display: block; }
div.startplan li a:hover { opacity: 0.7; box-shadow: 0 1px 3px rgba(0,0,0,0.3); }
div.startplan li p span { color: #FFF; font-size: 1.5em; font-weight: bold; display: block; }
div.startplan li.require01 { background: #DFB url(https://dimj76dz6kqyc.cloudfront.net/20190821124737_40660927.jpg) 50% 0 no-repeat; background-size: 100%; }
div.startplan li.require01 span { filter:drop-shadow(0 1px 4px rgba(48,102,0,1.0)); }
div.startplan li.require02 { background: #FC8 url(https://dimj76dz6kqyc.cloudfront.net/20190821124803_26104098.jpg) 50% 0 no-repeat; background-size: 100%; }
div.startplan li.require02 span { filter:drop-shadow(0 1px 4px rgba(168,102,0,1.0)); }
div.startplan li.require03 { background: #FCD url(https://dimj76dz6kqyc.cloudfront.net/20190821124828_55552677.jpg) 50% 0 no-repeat; background-size: 100%; }
div.startplan li.require03 span { filter:drop-shadow(0 1px 4px rgba(168,48,80,1.0)); }
/*--利用規約--*/
div.terms_body { width: 80%; margin: 2em auto 3em auto; }
div.terms_body h3 { font-size: 1.3em; font-weight: bold; line-height: 1.5em; border-bottom: #AAA double 3px; }
div.terms_body p.comment { color: #C44; font-size: .9em; line-height: 3em; text-indent: 1em; }
div#terms { width: 100%; height: 30em; padding: 1em 1.5em; font-size: .8em; line-height: 1.6em; background: #f3efef; box-shadow: 0 2px 3px 0 rgba(128,102,102,0.5) inset; border-radius: .5em; overflow-y: scroll; }
div#terms p.update { color: #655; font-size: .9em; text-align: right; }
div#terms h4 { margin-top: 1em; font-size: 1.2em; font-weight: bold; line-height: 1.5em; }
div#terms dt { margin-top: .5em; letter-spacing: 2px; }
div#terms dd { margin-bottom: .5em; padding-left: 1em; }
div#terms dd ul { margin: .5em 0 .5em 1em; }
div.btnbox { margin: 1.5em auto; text-align: center; }
div.btnbox input[type="checkbox"] { cursor: pointer; }
div.btnbox label { cursor: pointer; }
div.btnbox input[type="submit"] { width: 12em; margin: .5em auto; font-size: 1.2em; font-weight: bold; line-height: 2.5em; color: #FFF; background: #49D; border: 0; border-radius: .3em; cursor: pointer; -moz-appearance: none; -webkit-appearance: none; appearance: none; display: block; }
div.btnbox input[type="submit"]:hover { background: #E55; box-shadow: 0 2px 3px 0 rgba(0,0,0,0.3); }
div.btnbox input[type="submit"]:disabled { background: #AAA; cursor: auto; }
div.btnbox input[type="submit"]:disabled:hover { box-shadow: none; }
/*--情報登録--*/
div.service_body { width: 95%; margin: 0 auto; }
div.service_body h3 { margin-top: 1em; color: #49D; font-size: 1.2em; font-weight: bold; line-height: 1.2em; letter-spacing: 2px; }
div.service_body h3 span { margin-left: 1em; color: #F22; font-size: .6em; font-weight: normal; }
div.error { padding: 1em; color: #FFF; background: #F22; border-radius: .3em; display: table; }
div.error p { padding: 0 1em; vertical-align: middle; display: table-cell; }
div.service_body table { width: 100%; border-collapse: separate; border-spacing: 0 .5em; table-layout: fixed; }
div.service_body table tbody { width: 100%; padding: 0 .5em; background: #ebf6ff; display: block; }
div.service_body table th { min-width: 14em; padding: 1em; color: #FFF; background: #49D; font-size: .9em; text-align: center; }
div.service_body table th h4 { font-weight: bold; letter-spacing: 2px; margin: 0 1em; display: inline; }
div.service_body table th span { font-size: .8em; }
div.service_body table th.tit { padding: .5em 0 0 0; text-align: left; }
div.service_body table td { padding-left: .5em; }
div.service_body table td span { color: #F22; font-size: .8em; }
div.service_body table td span.gray { margin-left: 1em; color: #444; }
div.service_body table td span a { margin-left: 1em; padding: 0 1em 0 2.5em; font-size: 1em; line-height: 2.5em; color: #49D; border: #49D solid 1px; background: #FFF url(https://dimj76dz6kqyc.cloudfront.net/ico_open_b.svg) 1em 50% no-repeat; background-size: 1.2em; border-radius: .5em; display: inline-block; position: relative; }
div.service_body table td span a::before { content: ""; width: 0; height: 0; border-color: transparent #FFF transparent transparent; border-width: .5em 1.2em; border-style: solid; filter:drop-shadow(-2px 0 0 rgba(68,153,221,1.0)); position: absolute; left: -2.3em; top: .8em; }
div.service_body table td span a:hover { color: #FFF; background-color: #49D; background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_open.svg); box-shadow: 0 1px 3px 0 rgba(0,0,0,0.5); }
div.service_body table td span a:hover::before { border-color: transparent #49D transparent transparent; }
div.service_body table td input[type="text"] { padding: .5em; margin-right: .2em; }
div.service_body table td input[type="text"].SS { width: 4em; }
div.service_body table td input[type="text"].S { width: 7em; }
div.service_body table td input[type="text"].M { width: 21.5em; }
div.service_body table td input[type="text"].L { width: 42em; }
div.service_body table td input[type="button"] { margin-left: .5em; padding: .2em .6em; color: #E46; border: #E46 solid 1px; background: #FFF; font-size: 1em; border-radius: .3em; cursor: pointer; -moz-appearance: none; -webkit-appearance: none; appearance: none; }
div.service_body table td input[type="button"]:hover { color: #FFF; background: #E46; box-shadow: 0 1px 3px 0 rgba(0,0,0,0.5); }
div.service_body table td input[type="radio"] { margin-left: 1em; cursor: pointer; }
div.service_body table td label { cursor: pointer; }
div.service_body table td textarea { margin: .3em 0 0 0; }
div.service_body table td textarea.M { width: 26em; height: 6em; }
div.service_body table td textarea.L { width: 40em; height: 6em; }
div.service_body table td select { height: 2.5em; cursor: pointer; }
div.service_body table td select.S { width: 6em; height: 2em !important; }
div.service_body table td select.M { width: 12em; }
div.service_body table td select.L { width: 21.5em; }
div.service_body table tbody.address { background: #eefff7; }
div.service_body table tbody.address th { background: #4A9; }
div.service_body table tbody.address th.tit { color: #4A9; background: #eefff7; }
div.service_body table tbody.deliveryarea { background: #fcffee; }
div.service_body table tbody.deliveryarea th { background: #D83; }
div.service_body table tbody.deliveryarea th.tit { color: #D83; background: #fffcee; }
div.note { width: 96%; margin: 0 auto; font-size: .8em; }
div#contactFormBtn { width: 80%; padding: 1.5em 1em; margin: 1em auto; color: #06A; background: #EEE; border-radius: .8em; text-align: center; }
div#contactFormBtn input[type="submit"] { width: 12em; padding-right: 1em; margin: .5em auto; font-size: 1.4em; font-weight: bold; line-height: 3em; color: #FFF; background: #49D url(https://dimj76dz6kqyc.cloudfront.net/ico_next.svg) 92% 50% no-repeat; background-size: 1em; border: 0; border-radius: .3em; box-shadow: 0 1px 3px 0 rgba(0,0,0,0.3); cursor: pointer; -moz-appearance: none; -webkit-appearance: none; appearance: none; display: block; }
div#contactFormBtn input[type="submit"]:hover { background-color: #E46; box-shadow: 0 2px 3px 0 rgba(0,0,0,0.6); }
div.service_info { padding: 1.5em 2em; margin: 2em auto; background: #EEE; border-top: #CCC double 3px; }
div.service_info p { font-size: .9em; line-height: 1.8em; }
div.service_info p span { color: #06A; }
div.service_info ul { width: 90%; margin: .5em auto; padding: 1em .5em .5em .5em; background: #FFF; border-radius: .5em; text-align: center; }
div.service_info ul span { font-size: .9em; }
div.service_info li { width: 48%; margin: 0 1% .5em 1%; background: #EEE; border-radius: .3em; font-size: 1em; font-weight: bold; line-height: 2.5em; text-align: center; float: left; }
div.service_info li a { padding: 0 1em 0 2em; color: #FFF; background-color: #49D; background-position: 6% 50%; background-size: 1.5em; background-repeat: no-repeat; border-radius: .3em; display: block; }
div.service_info li a:hover { background-color: #E46; box-shadow: 0 2px 3px 0 rgba(0,0,0,0.6); }
div.service_info li a.mail { background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_mail.svg); }
div.service_info li a.pdf { background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_pdf.svg); }
/*--申込み完了--*/
div.finished { width: 90%; padding: 2em; margin: 1em auto; text-align: center; color: #FFF; background: #F22; }
div.finished h3 { width: 16em; padding-left: 1.5em; margin: 0 auto; font-size: 2em; font-weight: bold; line-height: 2em; color: #FE4; background: url(https://dimj76dz6kqyc.cloudfront.net/ico_checked_y.svg) 0 50% no-repeat; background-size: 1.2em; display: inline; }
div.finished p.pick { margin: 1em auto; padding: 1em; color: #F22; background: #FFF; border-radius: .5em; font-size: 1.2em; font-weight: bold; text-align: center; }
div.finished p { text-align: left; }
div.finished p span { font-weight: bold; color: #FE4; background: linear-gradient(transparent 50%, #C00 50%); }
div#contactFormBtn ul { width: 28em; margin: 0 auto; display: table; border-collapse: separate; border-spacing: 1em; }
div#contactFormBtn li { display: table-cell; vertical-align: middle; }
div#contactFormBtn li a { width: 12em; color: #FFF; background: #89A; border-radius: .4em; font-size: 1.4em; line-height: 3em; text-align: center; display: block; }
div#contactFormBtn li a:hover { background: #E46; box-shadow: 0 1px 3px 0 rgba(0,0,0,0.3); }
/*--付随情報--*/
div.subtit { padding: .5em 1em; color: #FFF; background: #49D url(https://dimj76dz6kqyc.cloudfront.net/ico_bat.svg) 103% 3px no-repeat; background-size: 160px; }
div.subtit p { font-size: 1.2em; font-weight: bold; line-height: 1.2em; }
div.areaquery_body { width: 80%; margin: 1em auto; }
div.areaquery_body p { margin: .5em auto; font-size: 1em; line-height: 1.5em; }
div.areaquery_body p span { padding-left: 1em; color: #F22; font-size: .8em; line-height: 2em; display: block; }
ul.point { width: 100%; padding: 1em; margin: 1em auto; background: #EEE; border-radius: .5em; }
ul.point li { margin: .25em 0 .25em 3em; color: #06A; font-weight: bold; list-style: circle; }
ul.point li span { padding-left: 1em; color: #666; font-size: .8em; font-weight: normal; }
div.mail { width: 50%; margin: .5em auto 2em auto; font-size: 1.2em; line-height: 1.2em; text-align: center; }
div.mail a { padding: 1em; color: #FFF; background: #49D url(https://dimj76dz6kqyc.cloudfront.net/ico_mail.svg) 6% 50% no-repeat; background-size: 1.5em; border-radius: .5em; display: block; }
div.mail a:hover { background-color: #E46; box-shadow: 0 2px 3px 0 rgba(0,0,0,0.6); }

input[type="button"].tabclose { padding: .5em 1.5em .5em 2.5em; margin: 1em auto; font-size: .8em; color: #C44; background-color: #FFF; background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_close_r.svg); background-position: 10% 50%; background-repeat: no-repeat; background-size: .7em; border: #C44 solid 1px; border-radius: .5em; cursor: pointer; -moz-appearance: none; -webkit-appearance: none; appearance: none; display: block; }
input[type="button"].tabclose:hover { color: #FFF; background-color: #C44; background-image: url(https://dimj76dz6kqyc.cloudfront.net/ico_close_w.svg); }
