@charset "UTF-8";
/* Reset Style
 * --------------------------------------- */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre,
form, fieldset, input, textarea, p, blockquote, th, td {
  padding: 0;
  margin: 0; }

a {
  text-decoration: none; }

table {
  border-spacing: 0; }

fieldset, img {
  border: 0; }

address, caption, cite, code, dfn, em, strong, th, var {
  font-weight: normal;
  font-style: normal; }

strong {
  font-weight: bold; }

ol, ul {
  list-style: none;
  margin: 0;
  padding: 0; }

caption, th {
  text-align: left; }

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
  font-size: 100%;
  margin: 0;
  padding: 0;
  color: #444; }

q:before, q:after {
  content: ''; }

abbr, acronym {
  border: 0; }

/* ////////////////////////////////////////////////
  Font Style
//////////////////////////////////////////////// */
html {
  font-size: 62.5%; }

body {
  /*font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; */
  font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
 /*font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;*/
   /*font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;*/
  *font-size: small;
  *font: x-small;
  line-height: 0; }



p {
  font-size: 100%;
  line-height: 1.5; }

h1 {
  font-size: 100%;
  line-height: 1.5; }

h2 {
  font-size: 100%;
  line-height: 1.5; }

h3 {
  font-size: 100%;
  line-height: 1.5; }

h4 {
  font-size: 100%;
  line-height: 1.5; }

h5 {
  font-size: 100%;
  line-height: 1.5; }

h6 {
  font-size: 100%;
  line-height: 1.5; }

table {
  font-size: 100%;
  line-height: 1.5; }

ul, ol, dl {
  line-height: 1.5; }

strong {
  font-weight: bold; }

sub {
  font-size: 64%;
  line-height: 1; }

sup {
  font-size: 64%;
  line-height: 1; }

form {
  line-height: 1.5; }

/* setting a consistent width, 160px; 
   control of type=file still not possible  */
input[type=text], input[type=password], input[type=number], textarea {
  font-size: 2rem;
  width: 85%;}

/*-------------------------------------------------
  Links 
-------------------------------------------------*/
/* Links */
a:link {
  text-decoration: none; }

a:visited {
  text-decoration: underline; }

a:hover, a:active {
  text-decoration: none; }

.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden; }

.clearfix {
  min-height: 1px; }

* html .clearfix {
  height: 1px;
  /*¥*/
  /*/
	height: auto;
	overflow: hidden;
	/**/ }

.both {
  clear: both; }

.inline_block {
  display: inline-block;
  *display: inline;
  *zoom: 1; }

/* Base Style
* --------------------------------------- */
body {
  color: #221814;
   font-size: 16px;
  font-size: 1.6rem;
  -moz-font-feature-settings: 'palt';
  -ms-font-feature-settings: 'palt';
  font-feature-settings: 'palt'; }

a:link {
  color: #221814; }

a:visited {
  color: #221814; }

a:hover {
  color: #221814;
  opacity: .8; }

a:active {
  color: #221814;
  opacity: .8; }

.hover:hover {
  opacity: .8; }

img {
  max-width: 100%; }

br.SP {
  display: none; }
br.PC {
  display: block; }


body a:link{color:#1a8fd6; text-decoration:underline;}
body a:visited{color:#1A8FD6; text-decoration:underline;}
body a:hover{color:#1eaaff; text-decoration:none;}
body a:active{color:#1eaaff; text-decoration:none;}


/*
 * header
 */
#header {
display: block; border-top: 3px #4bb3ee solid;}
.head_inner {max-width: 980px; position: relative; padding: .5% 0; margin: 0 auto;}
#header i {position: absolute;  right: 0; top: 0;}

/*
 * main
 */
#main { display: block; max-width: 980px; margin: 0 auto;}
#main .inner {max-width:880px; margin: 0 auto;}
.main_inner { padding: 0 2%;}
#main h1.pgttl { display: block; width: 70%;margin: 0 auto; padding: 5% 0; font-size: 5rem; color: #3cb9e9; font-weight: bold; position: relative; padding-left: 30%;}
#main h1.pgttl img.ico { position: absolute; margin: auto 0; left: 8%; border-radius: 200%; top: auto;}

div.simulation_box { display: block; margin: 4% auto; text-align: center;border: 1px #dddddd solid;background-color: #fafafa;padding:4%;}
div.simulation_box h2 { font-size: 1.7rem; font-weight: bold; text-align: left; vertical-align: top;}
h2 i { font-size: 1.5rem; display: inline-block; background-color: #3cb9e9; color: #fff; text-align: center; width: 72px; height: 55px; border-radius: 200%; font-style: normal; vertical-align: middle;line-height: 1.4;padding-top: 17px; margin-right: 1em; margin-top:1em;}
.answer h2 i { background-color: #e93c7c;height: 48px;padding-top: 24px;}

.lead { font-size: 1.6rem; line-height: 1.7em;}
.lead em { font-weight: bold;}
.txtR { text-align: right !important;}
.txtC {text-align: center !important;}
.txtB { font-weight: bold;}
.txtS { font-size: 1.4rem;}
.txtM { font-size: 1.6rem;}
.txtML { font-size: 2rem;}
.txtML i { font-size: 2.4rem;}
.txtLL { font-size: 3rem;}

.left_r { text-align: left;}
.right_l { text-align: right;}

.left { text-align: left;}
.right { text-align: right;}

.astLink { display: inline-block; background-attachment: scroll;background-image: url(../img/img_caution_pc.png); background-position: left center; background-repeat: no-repeat; padding-left: 20px; font-size: 1.2rem;}
.linkQuestion {display: inline-block; background-attachment: scroll;background-image: url(../img/icon_question.png); background-position: left center; background-repeat: no-repeat; padding-left: 26px; font-size: 1.3rem;line-height: 2;}

.astTxtRed { color: #ff0000; font-size: 1.3rem; font-weight: normal; line-height: 1.3em; text-align: left; text-indent: -3em; padding-left: 3em;}
.error { color: #ee244f; display: none; font-size: 1.4rem;}
.astTxt { font-size: 1.3rem;}
h3.cautionTtl { display: block; font-weight: bold; background-attachment: scroll; background-image: url(../img/img_caution_Lsize.png); background-position: left 0; background-repeat: no-repeat; padding-left: 32px; padding-bottom: .3em;}
.linebox { display: block; border: 1px #cccccc solid; padding: 2% 3%; margin: 20px auto;}

.list_circle {font-size: 1.4rem; padding-left: 2em;}
.list_circle li {list-style-type: circle;}


.btnBox { display: block; letter-spacing: -.5em; margin: 20px auto; width: 50%; }
.btnBox li { display: inline-block; letter-spacing: normal; width: 42%; margin: 0 1.5%;}
input,textarea {font-size:2rem;	padding:6px;text-align: right;border:1px #222 solid;}
label { display: block; margin-top: 10px; font-size: 1.4rem;}
/*form span { display: inline-block; padding-left: .3em; font-size: 1.4rem;}*/

input.pink {background-color: #ffd7f5;}
input.yellow {background-color: #fff100;}

input[type=text].txtML {font-size: 2.2rem;}

.btnBox input[type="submit"],
input#submit,
input#reset {width: 100%;background-color: #3cb9e9;border: 2px #3cb9e9 solid;border-radius: 6px;color: #fff;padding: 5px 4% 5px 4%;margin: 0 .5em;font-size: 2.0rem;text-align: center; font-weight: bold; cursor: pointer;}
input#reset {background-color: #acacac;border: 2px #acacac solid;color: #FFF;}
input#distributionSum { background-color: #fff100; font-size: 3.0rem; font-weight: bold;}
input[type="number"] {font-size: 2rem;}
#articles {}



.inquirybox { display: block; margin: 35px auto; width: 84%; border-radius: 6px; background-color: #f2f2f2;padding: 10px;}
.inquiry_inner { border: 1px #cccccc solid; padding: 3% 5%; background-color: #fff;}
h3.inquiryTtl { display: block; font-size: 1.8rem; font-weight: bold; border-bottom: 2px #ccc solid; margin-bottom: .7em; padding-bottom: .4em;}

.telbox { display: block; margin: 0 auto; width: 76.5%;}
.telbox p { font-size: 1.8rem;}
p.telnum { font-size: 5.0rem; color: #4bb3ee; font-weight: bold;}
p.telnum span { padding-right: 1%;}

p.no_mgb { margin-bottom: 0 !important; padding-bottom: 0 !important;}
.btnclose { display: block; margin: 30px auto; text-align: center;}


.pinkbox { display: inline-block; width: 3em; background-color: #ffd7f5; border: 2px #cccccc solid; margin: 0 .2em; height: 1.4em;}
.yellowbox { display: inline-block; width: 3em; background-color: #fff100; border: 2px #cccccc solid; margin: 0 .2em; height: 1.4em;}

.step1,.step2,.answer { padding-left: 78px; padding-bottom: 2em;}
.step1 h2, .step2 h2 , .answer h2 { margin-left: -80px;}
.calculation_box {display: table; width: 100%;}
.calculation_box span { display: table-cell; vertical-align: middle; padding: 0 .5em;}
table.fraction_td {    font-feature-settings: 'pkna';}
table.fraction_td td { padding: 3% 2% 3% 0%; text-align: left;}
.calculation_box i {font-style: normal;}
table.fraction_td td.line_btm { border-bottom: 2px #000 solid;}
table.fraction_td td.w_2 {width:160px;}
table.fraction_td td.w_3 {width:130px;}
table.fraction_td td input { margin-left: 5px;}

.bottom { vertical-align: bottom !important;}
span.w30 { width:30%;}



/*
 * footer
 */
.foot{
	text-align:left;
	background:#EBEBEB;
	margin:20px 0 0 0;
}
.foot_in{
	text-align:left;
	max-width:980px;
	margin:0 auto;
	padding:0 0 50px 0;
	overflow:hidden;
	zoom:1;
}
.foot ul{
	padding:20px 0 30px;
}
.foot ul li{
	display:inline;
	background:url(../img/icon01s.gif) no-repeat 0 5px;
	padding:0 0 0 10px;
	margin:0 20px 0 0;
	-webkit-background-size: 6px auto;
	background-size: 6px auto;
	font-size: 1.4rem;
}
.foot p{
	font-size:1.2rem;
}




#error {
  color: #f00;
  visibility: hidden;
  text-align: center;
}