@charset "UTF-8";
/* 
CSS Document 
ページ共通CSS
ヘッダ, フッタ, サイド
*/

body {
	font-family: "メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HiraKakuPro-W3","ＭＳ Ｐゴシック","MS PGothic",Arial, Helvetica,sans-serif;
	color:#333;
	font-size:13px;
	line-height:1.8;
	}
	
/*テキストリンク*/
a {
	color:#73C6BE;
	}
	
a:hover {
	}
	
.btn {
	display:inline-block;
	text-align:center;
	color:#fff;
	background:#FF84A5;
	border-radius:4px;
	text-decoration:none;
	padding:0.5em 1em;
	line-height:1em;
	}
.btn.large {
	font-size:140%;
	padding:0.8em 1em;
	width:80%;
	}

.btn.green {color:#fff;background-color:#6CC6BE;}
.btn.gray {color:#fff;background-color:#999;}
	
/*テキスト*/
.txt {padding-top:1em;padding-bottom:1em;}
.txt:nth-of-type(1) {margin-top:0;padding-top:0;}

/*ボックス*/
.constBox {padding-left:4%;padding-right:4%;}
#wrapper {
	max-width:640px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	padding-top:55px;
	}

.sec {
	margin-bottom:2em;
	padding-bottom:2em;
	border-bottom:1px solid #ECECEC;
	}
.sec:last-child {margin-bottom:0;border:none;}

.grayBox {
	background:#F9F9F9;
	border-radius:5px;
	padding:1em;
	}
	
/*ヘッダ*/
header {position:fixed;top:0;left:0;width:96%;padding:0 2%;background-color:#fff;z-index:1000}
header a#logo {color:inherit;text-decoration:none;}
header .tableLayout > * {vertical-align:middle;padding:1em 0;}
header .tableLayout p {
	font-weight:bold;
	font-size:92%;
	}
header .tableLayout #menu {width:25px;}
header .btnArea {
	width:85px;
	font-size:92%;
	}

header .navArea {display:none;position:absolute;left:0;width:100%;z-index:1000;}
header .navArea.open {display:block;}
header .navArea a {
	display:block;
	border-bottom:1px solid #fff;;
	color:#fff;
	text-decoration:none;
	padding:1em 4%;
	background:#70C6BE no-repeat 95% center url(../img/arrow_01.png);
	background-size:0.5em auto;
	}
	
/*フッター*/
footer {
	background:#999999;
	color:#fff;
	text-align:center;
	padding-top:1em;
	padding-bottom:1em;
	}
footer a {text-decoration:none;color:inherit;}
footer #cp {font-size:92%;}

/*見出し*/
.contentHead {text-align:center;font-weight:normal;font-size:150%;color:#fff;background:#70C6BE;line-height:1em;padding:0.5em 0;margin-bottom:30px;}
.secTit {border-left:5px solid #B9E2DE;font-weight:normal;line-height:1em;padding-left:0.5em;margin:2em 0 1em;}
.secTit:nth-of-type(1) {margin-top:0;}


/*相談一覧*/
.categoryArea li {text-align:center;margin-bottom:1em;}

/*カウンセリングの受け方*/
.tit01 {
	font-size:110%;
	color:#FF81A4;
	text-align:center;
	}
.tit01 span {
	font-size:150%;
	}
.exp {padding:1em;background-color:#F0F9F8;}

/*よくある質問*/
.qArea li {
	border:1px solid #DDDDDD;
	}
.qArea .qst {cursor:pointer;}
.qArea li:nth-of-type(n+2) {border-top:none;}
.qArea .qst.tableLayout > * {vertical-align:middle;}
.qArea .qst.tableLayout span:first-child {
	background:#70C6BE;
	color:#fff;
	font-size:150%;
	width:2em;
	text-align:center;
	}
.qArea .qst.tableLayout span:last-child {
	padding-left:1em;
	padding-right:3em;
	line-height:1.4em;
	position:relative;
	}
.qArea .qst.tableLayout span:last-child::after {
	content:"";
	width:1em;
	height:1em;
	display:block;
	position:absolute;
	top:0.9em;
	right:1em;
	background:url(../img/arrow_02.png) no-repeat;
	background-size:100% auto;
	transition:transform 0.3s ease-in-out;
	}
.qArea .ans {max-height:0;overflow:hidden;transition:max-height 0.3s ease-in-out;}
.qArea .ans {background:#F9F9F9;}
.qArea .ans .inner {padding:1em;}
.qArea .ans .inner::before {
	content:"A.";
	display:inline;
	font-size:150%;
	color:#FF80A4;
	}

.qArea li.open .ans {max-height:500px;}
.qArea li.open .qst.tableLayout span:last-child::after {transform:rotate(90deg);}

.point {
	padding:1em;
	background:#FFF2F6;
	border-radius:5px;
	color:#FF7FA4;
	font-weight:bold;
	text-align:center;
	margin-top:1em;
	}


/*声*/
.voice {
	background:#F9F9F9;
	padding:1em;
	margin-bottom:2em;
	}
.voice .spc {
	font-size:92%;
	color:#FF82A4;
	}
.voice h3 {
	font-size:110%;
	color:#6CC6BE;
	}
.voice .txt {padding-top:0;}
.voice .btn {font-size:150%;}
.voice .content {max-height:15em;overflow:hidden;position:relative;}
.voice .content .btnArea {position:absolute;bottom:0;width:92%;padding:15px 4%;background:rgba(255, 255, 255, 0.6);}

.voice.open .content {
	max-height:1000px;
	transition:max-height 0.3s ease-in-out;
	}
.voice.open .content .btnArea {display:none;}

/*問い合わせ*/
.btnbox {
	margin:30px 0;
	}
.btnbox a.btn {
	width:35%;
	margin:0 0.5%;
	background-position:93% center;
	background-repeat:no-repeat;
	background-image:url(../img/arrow_03.png);
	background-size:auto 0.3em;
	}

.telArea {
	text-align:center;
	padding:2em;
	background:#F0F9F8;
	}
.telArea > * {margin-top:1.5em;display:inline-block;}
.telArea > *:first-child {margin-top:0;}
	
form {
	margin-top:2em;
	}
form label {
	margin-top:1em;
	display:block;
	}
form span.wrn {color:#ff0000;margin-left:0.5em;}
form input[type=text] {width:96%;padding:0.1em 2%;font-size:150%;}
form .timeArea input[type=text] {width:5em;}
form textarea {width:96%;padding:0.3em 2%;height:5em;}
.formButton {
	border:none;
	background-position:93% center;
	background-repeat:no-repeat;
	background-image:url(../img/arrow_01.png);
	background-size:auto 0.5em;
	}
form .returnButton {
	background-position:93% center;
	background-repeat:no-repeat;
	background-size:auto 0.5em;
	width:70% !important;
	}