@charset "utf-8";

/* --------------------------------------------------
   RESET
-------------------------------------------------- */

/*
Copyright (c) 2009, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.8.0r4
*/

*, *:before, *:after {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;}

html{color:#000;background:#FFF;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}
del,ins{text-decoration:none;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:baseline;}
sub{vertical-align:baseline;}
legend{color:#000;}
input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}
input,button,textarea,select{font-size:16px;color:#404040;}
input[type="button"]{border:0;}


/* --------------------------------------------------
   ELEMENT
-------------------------------------------------- */
body {
	color:#000;
	font-family:'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	background:#ffffff;
	font-size:16px;
	margin:0 auto;
}
img {vertical-align:bottom;}
label {font-size:16px; border-radius:10px;}
@media screen and (max-width:500px) {
  label {font-size:12px;}
}
input {border-radius:10px;}

hr.black1 {margin: 0; border: 1px solid black;}

/* --------------------------------------------------
   HEADER
-------------------------------------------------- */
header section {height:130px; margin:0 auto; padding:10px 0 0; text-align:center;}
header section img {width: 152px; height: 115px;}
h1 {margin:0px auto; margin-bottom:1em; padding: 0; font-size:1rem; font-weight:bold;}

/* --------------------------------------------------
   CTA
-------------------------------------------------- */
#btnNextArea {position:relative; margin:0 auto; padding-bottom:50px; text-align:center;}
#btnNextArea.initialhide {display: none;}
#btn_send {cursor: pointer; border: 6px solid #A1D01B; color: #FFFFFF; font-size: 32px; height: 3em; width: 95%; box-shadow:0 0 9px rgba(0, 0, 0, 0.5); background:#93c625; background: -moz-linear-gradient(top, #b1db10, #93c625); background: -webkit-gradient(linear, center top, center bottom, from(#b1db10), to(#93c625)); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#FFb1db10', endColorstr='#FF93c625'); border-radius: 18px; -webkit-border-radius: 18px; -moz-border-radius: 18px;}
.icon_w_triangle {width: 0; height: 0; border: 14px solid transparent; border-left: 14px solid #fff; position:absolute; right:24px; top:34px;}

/* --------------------------------------------------
   CONTENTS
-------------------------------------------------- */
div#content {background-color: #e3edf8;}
div#content > div {max-width:768px; margin:0 auto; padding:1em;}
form#confirm {max-width:768px; margin:0 auto; padding:1em;}

/* --------------------------------------------------
   FORMBOX
-------------------------------------------------- */

section#formBox {width:100%; margin:20px 0 0;}
section#formBox p {font-size:16px;}

section#formBox dl {width:100%;}
section#formBox dl.initialhide {display: none;}
section#formBox dl dt {padding:10px}
section#formBox dl dt p {font-size:16px; font-weight:bold; line-height:1.0; margin:0 auto; text-indent:-1em; padding-left:1em;}
section#formBox dl dt p span {margin-right:10px; padding:3px 8px; border-radius:4px; background:#ff7f7f; color:#fff; font-size:12px; vertical-align:middle;}
section#formBox dl dt p span.ninni {background-color: #999;}
section#formBox dl dd {font-size:16px; padding:0 5px 10px 10px;}
section#formBox dl dd:last-of-type {padding-bottom:1em;}
section#formBox dl dd div {margin: 0 auto; display:flex; flex-wrap:wrap;}
section#formBox dl#aboutdl dd span {display: inline-block; margin-left: 1em;}

section#formBox input[type=text],
section#formBox input[type=email],
section#formBox input[type=tel]{appearance:none; padding:5px 10px; border:solid 2px #838383; width:100%; font-size:16px;}
section#formBox input[type="text"]:-ms-input-placeholder,
section#formBox input[type="email"]:-ms-input-placeholder,
section#formBox input[type="tel"]:-ms-input-placeholder {color:#bbb; font-size:16px;}
section#formBox input[type=text]:placeholder-shown,
section#formBox input[type=email]:placeholder-shown,
section#formBox input[type=tel]:placeholder-shown {color:#bbb; font-size:16px;}
section#formBox input[type=radio] {display: none;}
section#formBox input[type=radio]:checked + label {background:#eeffed; box-shadow:0 2px 2px #aaa inset; -moz-box-shadow:0 2px 2px #aaa inset; -webkit-box-shadow:0 2px 2px #aaa inset; -o-box-shadow:0 2px 2px #aaa inset; -ms-box-shadow:0 2px 2px #aaa inset;}
section#formBox input[type=radio] + label {padding:5px 5px; width:100%; display:block; border-radius:10px; border:solid 2px #838383; font-size:16px; text-align:center; box-shadow:0 2px 2px #aaa; -moz-box-shadow:0 2px 2px #aaa; -webkit-box-shadow:0 2px 2px #aaa; -o-box-shadow:0 2px 2px #aaa; -ms-box-shadow:0 2px 2px #aaa; background:#ffffff; color:#000000;}
section#formBox input[name=agerange] + label {width:50%;}
section#formBox input[type=checkbox] {display: none;}
section#formBox input[type=checkbox]:checked + label {background:#eeffed; box-shadow:0 2px 2px #aaa inset; -moz-box-shadow:0 2px 2px #aaa inset; -webkit-box-shadow:0 2px 2px #aaa inset; -o-box-shadow:0 2px 2px #aaa inset; -ms-box-shadow:0 2px 2px #aaa inset;}
section#formBox input[type=checkbox] + label {padding:5px 5px; width:100%; display:block; border-radius:10px; border:solid 2px #838383; font-size:16px; text-align:center; box-shadow:0 2px 2px #aaa; -moz-box-shadow:0 2px 2px #aaa; -webkit-box-shadow:0 2px 2px #aaa; -o-box-shadow:0 2px 2px #aaa; -ms-box-shadow:0 2px 2px #aaa; background:#ffffff; color:#000000;}

p.description {margin:16px 16px -32px 16px; font-size:16px;}
section#formBox input[type=radio] + label:last-child {border-radius: 10px;}
section#formBox input[type=radio] + label {font-size:18px;}
section#formBox textarea {width:100%; height:15em;}

section#formBox select{width: 100%; appearance: none; padding: 5px 10px; border: solid 2px #838383; border-radius: 10px;}
/* --------------------------------------------------
   FOOTER
-------------------------------------------------- */
p.copyright {color:#000000; font-size:16px; margin:10px 0; text-align:center;}

