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


/*******************************
共通
********************************/


/***********************************************************************
「★PC版 CSS★」ブラウザの幅が721px以上ならここの記述が有効になる
**********************************************************************/
@media all and (min-width: 721px) {

body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	-webkit-text-size-adjust: none;
	line-height:1.3em;
	font-size:16px;
	background:#dedede;
	color:#222222;
}

/*.box_a br,.box_b br,.box_c br,.box_d br{display:none;}*/
.box_b dd br {display: inline;}
#header hr/*,#contents hr*/{display:none;}
.pc_mem{ opacity:0;}

/* リンク設定
------------------------------------------------------------*/
a{font-weight:bold;color:#012594;}
a:hover{color:#0D015B;}
a:active, a:focus{outline:0;}


/* 全体
------------------------------------------------------------*/
#wrapper_all{
	width:720px;
	margin:0 auto;
}

#wrapper{
	width:720px;
	margin:0 auto;
	position:relative;
	background:#ffffff;
	padding-bottom:20px;
}
#contents{width:660px; margin:0 auto;}

font.sub{
	color:#DDD;
	font-size:12px;
	font-weight:bold;
	margin-left:2px;
}

/* フッター*/
#footer{font-size:0.8em;text-align:center;}


/*---------------------------------------
 PC用 
 -----------------------------------------*/

/* ヘッダー
------------------------------------------------------------*/
#header {font-size:0.8em;}
#head_sp{ display:none;}
#head_pc{
	height:200px;
	background:url(../images/ttl.png) no-repeat;
}
#header .flow{
	padding-left:30px;
	padding-right:30px;
	line-height:2em;
	background:#EEF9FF;
	text-align:center;
}


#header .bar{
	margin-left:30px;
	margin-right:30px;
	margin-bottom:10px;
	margin-top:10px;
	padding:3px;
	font-weight:bold;
	text-align:center;
	color:#FFFFFF;
	background-color:#333;
}
#header .attention_tel{
	padding-left:30px;
	padding-right:30px;
	margin-bottom:20px;
	margin-top:10px;
	text-align:center;
	font-size:1.1em;
}
#header .attention_top,
#header .attention_form{
	padding-left:35px;
	padding-right:35px;
	margin-bottom:20px;
	margin-top:20px;
	font-size: 14px;
	line-height: 1.4em;
}
.small{font-size:0.9em;
line-height:1.4em;
color:#666;}

.big{font-size:1.3em;
line-height:1.4em;
color:#012594;}

.l_height{
	height: 90px;
}

p.come{
	color: #E22208;
	font-size: 12px;
	line-height: 1.2em;
	margin-top: 5px;
}

p.text{
	text-align: center;
	margin: 20px;
}


/* コンテンツ
------------------------------------------------------------*/
#contents{ margin:0 auto;font-size:0.9em;line-height:1.5em;}
#contents .box{margin-top:20px;}

#contents hr {
	border:dotted 1px #AAA;
	margin:3px 0;
	width:100%;}


#contents h2{
	background:#570057;
	color:#ffff00;
	padding-left:10px;
	margin-top:10px;
	line-height:3em;
	text-align:center;
}
#contents h3{
	background:#6F4C22;
	color:#ffffff;
	padding-left:10px;
	margin-top:10px;
	line-height:3em;
}
#contents #mida{
	border-radius: 6px;
	color:#00A5C1;
	text-align: center;
	padding: 5px;
	font-size: 14px;
	line-height: 1.4em;
	border: 1px solid #00A5C1;
	margin:10px 0;
}
#contents h4{
	background:#FF4000;
	color:#ffffff;
	padding-left:10px;
	margin-top:10px;
	line-height:3em;
}


#quiz01{
	width:80%;
	padding:3px;
	margin:0 auto;
	text-align:center;
	border:1px solid #E36989;
	background-color:#E36989;
	font-size:20px;
	color:#ffffff;}

#quiz02{
	width:80%;
	padding:10px 3px;
	margin:0 auto 20px;
	text-align:center;
	border:1px solid #E36989;
	background-color:#FFFFFF;
	font-size:18px;
	color:#E36989;
	font-weight:bold;}


/* box_a
------------------------------------------------------------*/
.box_a{ padding-bottom:30px;}
.box_a dl {
	width:660px;
  background:url(../images/bg_dt.gif) repeat-y;
  border:1px solid #ffffff;
/*  overflow:hidden;*/
}
.box_a dl.color3 {background:url(../images/bg_dt3.gif) repeat-y;}

.box_a dt,
.box_a dd {	padding: 8px 5px;}

.box_a dt {
	clear: left;
	float: left;
	width: 260px;
	color:#ffffff;
}
.box_a dt span {font-size:0.8em;}
/* .box_b dt span.point01 {color:#EE9B48;}
.box_b dt span.point02 {color:#FBCF63;}*/
.box_a dd {margin-left: 280px; margin-right:20px;font-size:0.9em;word-break: break-all;}

/* box_b
------------------------------------------------------------*/
.box_b{ padding-bottom:10px;}
.box_b dl {
	width:660px;
  background:url(../images/bg_dt.gif) repeat-y;
  border:1px solid #ffffff;
/*  overflow:hidden;*/
}
.box_b dl.color2 {background:url(../images/bg_dt2.gif) repeat-y;}
.box_b dl.color3 {background:url(../images/bg_dt3.gif) repeat-y;}

.box_b dt,
.box_b dd {	padding: 8px 5px;}

.box_b dt {
	clear: left;
	float: left;
	width: 260px;
	color:#ffffff;
}
.box_b dt span {font-size:0.8em;}
/* .box_b dt span.point01 {color:#EE9B48;}
.box_b dt span.point02 {color:#FBCF63;}*/
.box_b dd {margin-left: 280px; margin-right:20px;font-size:0.9em;word-break: break-all;}

/* box_c
------------------------------------------------------------*/
.box_c{ padding-bottom:30px;}
.box_c dl {
	width:660px;
  background:url(../images/bg_dt.gif) repeat-y;
  border:1px solid #ffffff;
/*  overflow:hidden;*/
}

.box_c dt,
.box_c dd {	padding: 8px 5px;}

.box_c dt {
	clear: left;
	float: left;
	width: 260px;
	color:#ffffff;
}
.box_c dt span {font-size:0.8em;}
/* .box_b dt span.point01 {color:#EE9B48;}
.box_b dt span.point02 {color:#FBCF63;}*/
.box_c dd {margin-left: 280px; margin-right:20px;font-size:0.9em;word-break: break-all;}


/* フォームスタイル 
------------------------------------------------------------*/
#mem{
	position:relative;
	top:0;
	z-index:1000px;
	width:40px;
	background:#666666;
	height:121px;
	margin-bottom:-167px;
	text-align:center;
	color:#FFF;
	padding-top:45px;
}
#mem br{
	display:block;
}

select{ font-size:1em;line-height:1.5em;padding:4px; }

textarea{ font-size:1em;line-height:1.4em;}
textarea:focus,textarea:hover{}
.focus{}

/*テキストエリア・幅*/
.box_add,
.box_company,
.box_unit,
.box_mail,
.box_title {width:300px;}
.box_name { width:100px;}
.box_tel,
.box_zip{ width:70px;}

.box_opinion{
	width:340px;
	height:80px;}

input{
	padding:2px;
	width:300px;
	border:1px #CCC solid;
	font-size:1em;
}

#dt_over{
	width: 250px;
}

/* ラジオボタン指定 */	
input.radio {}
label.mailmag,
label.souhu,
label.anc {display:inline-block; width:120px;}

label.bumon{display:inline-block; width:100px;}

input[type="radio"] {
    position: relative;
    -webkit-appearance: button;
    appearance: button;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    content: "";
    background-color: #FFFFFF;
    border: 1px solid #999999;
    -webkit-border-radius: 24px;
    border-radius: 24px;
    -webkit-box-shadow: inset 4px 4px 10px rgba(0,0,0,0.2);
    box-shadow: inset 4px 4px 10px rgba(0,0,0,0.2);
    vertical-align: middle;
    cursor: pointer;
}

input[type="radio"]:checked:after {
    display: block;
    position: absolute;
    top: 3px;
    left: 3px;
    content: "";
    width: 12px;
    height: 12px;
    background: #F99E05;
    -webkit-border-radius: 12px;
    border-radius: 12px;
}

#sign table {
  border-collapse:collapse;
  border:1px solid #FFFFFF;
  width:430px;
  margin:20px auto;
}
#sign th,#sign td {
  background:#FFFFFF;
  border:1px solid #FFFFFF;
}
.sign_size{ width:380px; font-size:14px; color:#222222;}

/*確認画面用ボタン*/
#bt_gr{ width:380px; overflow:hidden;margin:0 auto;}
.bt_gr_left{ width:180px; float:left; padding:0 20px 0 0;}
.bt_gr_right{width:180px; float:right;}



#bt_gr input[type="button"]{
	font-size:1em;
	line-height:3em;
	width:150px;
	margin:0 auto;
	display:block;
	cursor:pointer;
    color:#000000;
 	-moz-border-radius:4px ;
	-webkit-border-radius:4px;
	border-radius: 4px;
}
#bt_gr input[type="button"]:hover{background:#999999;}


#bt_gr input[type="submit"]{
	font-size:1em;
	line-height:3em;
	width:150px;
	margin:0 auto;
	display:block;
	cursor:pointer;
    background:#FF8000;
	color:#ffffff;
 	-moz-border-radius:4px ;
	-webkit-border-radius:4px;
	border-radius: 4px;
}
#bt_gr  input[type="submit"]:hover{background:#E95520;color:#ffffff;}


/*
OK画面
-------------------------------------------------------*/
.ok{
	font-size:1.5em;
	line-height:2em;
	padding:50px 0;
	text-align:center;
}

.ok #txt{
	font-size: 16px;
	line-height: 1.4em;
	margin-top: 20px;
}

.ok #txt p{margin-top: 10px;}

#footer img{
	width: 250px;
	margin-bottom: 8px;
}
}

/***********************************************************************
「★SP版 CSS★」ブラウザの幅が720px以下ならここの記述が有効になる
**********************************************************************/
@media only all and (max-width: 720px) {

body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	-webkit-text-size-adjust: none;
	font-size:30px;
	line-height:1.5em;
}


.box_a br,.box_b br,.box_c br,.box_d br,#mem{display:none;}
.box_b dd br {display: inline;}
#header hr/*,#contents hr*/{display:none;}


/* リンク設定
------------------------------------------------------------*/
a{color:#012594;}
a:hover{color:#0D015B;}
a:active, a:focus{outline:0;}



/* 全体
------------------------------------------------------------*/
#wrapper_all{width:720px;}
#wrapper{background:#ffffff;}
#contents{}
#footer{font-size:0.6em;text-align:center;}

font.sub{
	color:#DDD;
	font-weight:bold;
	margin-left:2px;
}



p.come{
	color: #E22208;
	font-size: 24px;
	line-height: 1.2em;
	margin-top: 5px;
}

p.text{
	text-align: center;
	margin: 20px;
}

/*---------------------------------------
SP用 
 -----------------------------------------*/
 
 
 
/* ヘッダー
------------------------------------------------------------*/
#header {font-size:30px;line-height:1.6em;}
#head_sp{
	height:200px;	
	background:url(../images/ttl.png) no-repeat;
}
#head_pc{display:none;}
#header .flow{
	padding:15px;
	line-height:1.2em;
	background:#FFFFBF;
}
#header .bar{
	margin-bottom:10px;
	margin-top:10px;
	padding:3px;
	font-weight:bold;
	text-align:center;
	color:#FFFFFF;
	background-color:#333;
}
#header .attention_tel{
	padding-left:20px;
	padding-right:20px;
	margin-bottom:20px;
	margin-top:10px;

}
#header .attention_top,
#header .attention_form{
	padding-left:20px;
	padding-right:20px;
	margin-bottom:20px;
	margin-top:10px;
}
.small{font-size:22px;
color:#666;}

.big{font-size:1.3em;
line-height:1.4em;
color:#012594;}


/* コンテンツ
------------------------------------------------------------*/
#contents{ font-size:30px;line-height:1.6em;}
#contents .box{margin-top:20px;}


#contents hr {
	border:dotted 2px #AAA;
	margin:10px  auto;
	width:700px;}


#contents h2{
	background:#717171;
	color:#ffff00;
	padding-left:10px;
	margin-top:0;
	line-height:1.85em;
}
#contents h3{
	background:#6F4C22;
	color:#ffffff;
	padding-left:10px;
	margin-top:20px;
	line-height:2em;
}
#contents #mida{
	border-radius: 6px;
	color:#00A5C1;
	text-align: center;
	padding: 5px;
	font-size: 30px;
	line-height: 1.4em;
	border: 2px solid #00A5C1;
	margin:40px 20px 20px 20px;
}

#contents #mida br{display: none;}
#contents h4{
	background:#FF4000;
	color:#ffffff;
	padding-left:10px;
	margin-top:10px;
	line-height:2em;
}

#quiz01{
	width:96%;
	padding:5px;
	margin:0 auto;
	text-align:center;
	border:1px solid #FF5959;
	background-color:#FF5959;
	font-size:1.2em;
	color:#ffffff;}

#quiz02{
	width:96%;
	padding:10px 5px;
	margin:0 auto 20px;
	text-align:center;
	border:1px solid #FF5959;
	background-color:#FFFFFF;
	font-size:1em;
	color:#FF5959;
	font-weight:bold;}



/* box_a…
------------------------------------------------------------*/
.box_a{padding-bottom:40px;}
.box_a dl {
  border:1px solid #ffffff;
  overflow:hidden;
}


.box_a dt {
	color:#ffffff;
	background:#FF9326;
	line-height:2em;
	padding-left:10px;
}
.box_a dt span {}
/* .box_b dt span.point01 {color:#EE9B48;}
.box_b dt span.point02 {color:#FBCF63;}*/

.box_a dd {
	background:#ECECEC;
	padding-top:10px;
	padding-bottom:20px;
	padding-left:10px;
-ms-word-break: break-all;
 word-break: break-all;
}


/* box_b…
------------------------------------------------------------*/
.box_b{padding-bottom:0px;}
.box_b dl {
  border:1px solid #ffffff;
  overflow:hidden;
}


.box_b dt {
	color:#ffffff;
	background:#717171;
	line-height:2em;
	padding-left:10px;
}
.box_b .color2 dt {
	color:#ffffff;
	background:#0095D6;
	line-height:2em;
	padding-left:10px;
}
.box_b .color3 dt {
	color:#ffffff;
	background:#E95520;
	line-height:2em;
	padding-left:10px;
}
.box_b dt span {}
/* .box_b dt span.point01 {color:#EE9B48;}
.box_b dt span.point02 {color:#FBCF63;}*/

.box_b dd {
	background:#ECECEC;
	padding-top:10px;
	padding-bottom:20px;
	padding-left:10px;
-ms-word-break: break-all;
 word-break: break-all;
}

/* box_c…
------------------------------------------------------------*/
.box_c{padding-bottom:40px;}
.box_c dl {
  border:1px solid #ffffff;
  overflow:hidden;
}


.box_c dt {
	color:#ffffff;
	background:#FF9326;
	line-height:2em;
	padding-left:10px;
}
.box_c dt span {}
/* .box_b dt span.point01 {color:#EE9B48;}
.box_b dt span.point02 {color:#FBCF63;}*/

.box_c dd {
	background:#ECECEC;
	padding-top:10px;
	padding-bottom:20px;
	padding-left:10px;
-ms-word-break: break-all;
 word-break: break-all;
}



/* フォームスタイル */	
input,textarea{
	font-size:36px;
	width:92%;
	padding:2%;	
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

select {
	font-size:36px;
	width:92%;
	padding:2%;	
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

input:focus,input:hover{ background:#E6FFFF;}
/**/
.box_add,
.box_company,
.box_unit,
.box_mail,
.box_title{width:90%;}
.box_name { width:30%;}
.box_zip { width:12%;}
.box_tel {width:20%;}

/* ラジオボタン指定 */	
input.radio {display:inline-block; width:20px; height:30px; vertical-align:top;}
 label.mailmag,
 label.souhu,
 label.bumon,
  label.anc {display:inline-block; width:45%; height:50px; line-height:50px; background:#FFF; border:1px solid #CCC; padding-left:20px;}

 
input[type="radio"] {
    position: relative;
    -webkit-appearance: button;
    appearance: button;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    content: "";
    background-color: #FFFFFF;
    border: 1px solid #999999;
    -webkit-border-radius: 24px;
    border-radius: 24px;
    -webkit-box-shadow: inset 4px 4px 10px rgba(0,0,0,0.2);
    box-shadow: inset 4px 4px 10px rgba(0,0,0,0.2);
    vertical-align: middle;
    cursor: pointer;
}

input[type="radio"]:checked:after {
    display: block;
    position: absolute;
    top: 3px;
    left: 3px;
    content: "";
    width: 12px;
    height: 12px;
    background: #003399;
    -webkit-border-radius: 12px;
    border-radius: 12px;
}

#sign table {
  border-collapse:collapse;
  margin:0 auto;
  border:1px solid #FFFFFF;
}
#sign th,#sign td {
  background:#FFFFFF;
  border:1px solid #FFFFFF;
}
.sign_size{ width:95%; font-size:22px; color:#333333; margin:0 auto;}

/*確認画面用ボタン*/
#bt_gr{ width:90%; margin:20px auto 60px auto;}
.bt_gr_left{text-align:center;}
.bt_gr_right{ text-align:center;}


#bt_gr input[type="button"]{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: none;
	font-size:1.5em;
	line-height:2em;
	width: 90%;
	margin: 0 auto;
	display: block;
	cursor: pointer;
	color: #FFF;
	background: #999;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	margin-top: 20px;
	-webkit-box-shadow: 0px 3px 6px rgba(0,0,0,0.30);
	box-shadow: 0px 3px 6px rgba(0,0,0,0.30);
}
#bt_gr input[type="button"]:hover{background:#666;}

#bt_gr input[type="submit"]{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: none;
	font-size:1.5em;
	line-height:2em;
	width:90%;
	margin:0 auto;
	display:block;
	cursor:pointer;
    background:#FF8000;
	color:#ffffff;
 	-moz-border-radius:10px ;
	-webkit-border-radius:10px;
	border-radius: 10px;
	margin-top: 20px;
	-webkit-box-shadow: 0px 3px 6px rgba(0,0,0,0.30);
	box-shadow: 0px 3px 6px rgba(0,0,0,0.30);
}
#bt_gr input[type="submit"]:hover{background:#FF052C;}


#bt_gr .bt_gr_left input[type="button"],
#bt_gr .bt_gr_right input[type="submit"]{
	width: 90%;
}


/*
OK画面
-------------------------------------------------------*/
.ok{
	font-size:0.9em;
	padding:80px 0;
	text-align:center;
}

.ok #txt{
	margin-top: 20px;
}
.ok .come{
	padding: 30px;
}

#footer img{
	width: 400px;
	margin-bottom: 8px;
}
}