@charset "utf-8";

/* ----------------------------------------------------------------
* 01. base
* 02. header
* 03. LP main
----------------------------------------------------------------- */

/* ----------------------------------------------------------------
01. base
----------------------------------------------------------------- */

body { background-position: center -235px }
#header { height: 92px }
#wrap #header_h1 {
font-size: 12px !important;
left: 203px;
top: 41px;
}
#wrap #header_logo {
left: 4px;
top: 20px;
}
#wrap #sns {
left: auto;
right: 0;
top: 38px;
}
ul#gnavi.sec { background-image: url(../img/sec_bg_lp.png) }
div#contents { background-image: url(../img/sec_bg_lp.png) }
.lp_main { text-align: left }


/**
* page top
**/
.btnPageTop {
background-color: #2770a6;
height: 31px;
margin: 0 6px 0 14px;
padding-top: 10px;
text-align: center;
}
.btnPageTop a { display: block }
.btnPageTop:hover { background-color: #297eaa }

/* ----------------------------------------------------------------
02. header
----------------------------------------------------------------- */

.lp_main h1 { clear: both }

/* ----------------------------------------------------------------
03. LP main
----------------------------------------------------------------- */

.mgb0 { margin-bottom: 0!important }
.mgb5 { margin-bottom: 5px!important }
.mgb10 { margin-bottom: 10px!important }
.mgb15 { margin-bottom: 15px!important }
.mgb20 { margin-bottom: 20px!important }
.mgb25 { margin-bottom: 25px!important }
.mgb30 { margin-bottom: 30px!important }
.mgb35 { margin-bottom: 35px!important }
.mgb40 { margin-bottom: 40px!important }
.mgb45 { margin-bottom: 45px!important }
.mgb50 { margin-bottom: 50px!important }
.mgb60 { margin-bottom: 60px!important }
.mgb70 { margin-bottom: 70px!important }
.mgt70 { margin-top: 70px!important }
.mgl10 { margin-left: 10px }
.mgl15 { margin-left: 15px }
.mgr10 { margin-right: 10px }
.mgr15 { margin-right: 15px }

.tac { text-align: center }

.fs13 { font-size: 13px }
.fs14 { font-size: 14px }
.fs16 { font-size: 16px }
.fwn { font-weight: normal }
.fwb { font-weight: bold }
.fcr { color: #e04d4d }
.fcb { color: #256c9a }

/**
* main
**/

.wrapCal {
background-color: #fff;
font-size: 16px;
margin: 0 auto;
padding: 25px 0 0 10px;
width: 730px;
}
.wrapCal img { vertical-align: bottom }
.wrapCal a:link,
.wrapCal a:visited { color: #333 }
.wrapCal a:hover,
.wrapCal a:active {
color: #666;
text-decoration: underline;
}
#resultLv1.hide,
#resultLv2.hide { display: none }

/**
* title
**/

.ttlInput,
.ttlResult {
background-position: 0 0;
background-repeat: no-repeat;
font-size: 22px;
font-weight: bold;
line-height: 2;
margin: 10px 0;
padding: 0 0 0 15px;
}
.ttlInput { background-image: url(../img/lp/title_input.png) }
.ttlResult { background-image: url(../img/lp/title_result.png) }
.ttlResult span { margin-left: 20px }
.lp_main h3 {
font-size: 18px;
font-weight: bold;
margin: 23px 0 10px;
padding: 5px 0;
}
.lp_main .fcr { color: #f00 }
.lp_main .lp_text { margin-left: 190px }
.ttlCaution {
border-bottom: double 3px #b6b6b6;
font-size: 16px;
font-weight: bold;
margin-bottom: 5px;
padding-bottom: 5px;
}
.ttlMerit {
font-size: 20px;
font-weight: bold;
margin-bottom: 15px;
}
.ttlMerit img {
margin-right: 20px;
padding-bottom: 5px;
vertical-align: middle;
}
.ttlMerit:after {
background-color: #5ec1b0;
background-image: -ms-linear-gradient(top, #86d1c4 0%, #47b8a4 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #86d1c4), color-stop(1, #47b8a4));
background-image: linear-gradient(to bottom, #86d1c4 0%, #47b8a4 100%);
content: '';
display: block;
height: 4px;
margin-top: 2px;
width: 100%;
}


/**
* tab
**/

.wrapTab {
border-bottom: 2px solid #256c9a;
margin: 30px 0 20px;
}
.tab {
-webkit-box-shadow: inset 0 1px 1px rgba(255,255,255,0.2);
background-color: #266f9d;
background-image: -ms-linear-gradient(top, #266f9d 0%, #22628a 50%, #086da3 52%, #3789b3 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #266f9d), color-stop(0.5, #22628a), color-stop(0.53, #086da3), color-stop(1, #3789b3));
background-image: linear-gradient(to bottom, #266f9d 0%, #22628a 50%, #086da3 52%, #3789b3 100%);
border: 2px solid #256c9a;
border-bottom: none;
border-radius: 4px 4px 0 0;
box-shadow: inset 0 1px 1px rgba(255,255,255,0.2);
color: #fff;
cursor: pointer;
display: inline-block;
font-weight: bold;
letter-spacing: 1px;
line-height: 1;
padding: 8px 0 10px;
text-align: center;
vertical-align: bottom;
width: 359px;
}
.tab:hover {
background-color: #2c81b6;
background-image: -ms-linear-gradient(top, #2c81b6 0%, #2875a5 50%, #097bb7 52%, #3d98c8 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #2c81b6), color-stop(0.5, #2875a5), color-stop(0.53, #097bb7), color-stop(1, #3d98c8));
background-image: linear-gradient(to bottom, #2c81b6 0%, #2875a5 50%, #097bb7 52%, #3d98c8 100%);
}
.tab:first-child { margin-right: 4px }
.tab.select {
background-color: #f0f3f5;
background-image: none;
color: #333;
cursor: default;
padding: 10px 0 12px;
}
.tab span { font-size: 20px }
.tab.select span { color: #256c9a }
.wrapTabBody { display: none }
.wrapTabBody.active { display: block }


/**
* error
**/

#errorCom2,
#errorCom {
border: 2px solid #e04d4d;
color: #e04d4d;
display: none;
font-weight: bold;
margin: 20px 0;
padding: 8px 30px;
}
#errorCom2.active,
#errorCom.active { display: block }


/**
* table
**/
/* -- input -- */

.inputTbl { width: 100% }
.inputTbl .list th { padding: 10px 0 5px }
.inputTbl .ctgry {
background-color: #9bbedb;
border-bottom: 2px solid #fff;
padding: 11px 20px;
vertical-align: top;
}
.inputTbl .subCtgry {
background-color: #c8dae9;
border-bottom: 2px solid #fff;
padding: 11px 10px;
}
.inputTbl .tblW1 { width: 433px }
.inputTbl td {
background-color: #e7e7e7;
border-bottom: 2px solid #fff;
padding: 0 23px 0 30px;
text-align: right;
}
.inputTbl td.slct { padding: 0 30px }
.inputTbl td.noteCell {
background-color: #fff;
text-align: left;
padding: 20px 0 12px;
}
.inputTbl td.noteCell .note2 {
padding-left: 35px;
padding-right: 15px;
text-indent: -15px;
}
.inputTbl td.empty {
background-color: #fff;
height: 22px;
}
.inputTbl td select {
-webkit-box-sizing: border-box;
border: 1px solid #b2b2b2;
border-radius: 5px;
box-sizing: border-box;
height: 34px;
width: 100%;
}
.inputTbl td input {
-webkit-box-sizing: border-box;
border: 1px solid #b2b2b2;
border-radius: 5px;
box-sizing: border-box;
height: 34px;
margin-right: 12px;
padding: 0 5px;
text-align: right;
width: 160px;
}
.inputTbl td input.error { border: 1px solid #e04d4d }


/* -- result -- */

.resultTbl { width: 100% }
.resultTbl thead td,
.resultTbl thead th {
background-color: #81d1c3;
border: 2px solid #fff;
border-top: none;
padding: 10px 10px;
text-align: center;
}
.resultTbl th,
.resultTbl td {
background-color: #e7e7e7;
border: 2px solid #fff;
padding: 11px 20px;
}
.resultTbl td { text-align: right }
.resultTbl tfoot th,
.resultTbl tfoot td {
background-color: #d0d0d0;
font-weight: bold;
}
.resultTbl .tblW1 { width: 160px }
.resultTbl .tblW2 { width: 180px }
.resultTbl .tblW3 { width: 50% }


/* -- result2.3 -- */

.resultTbl2 {
margin: 0 auto;
width: 555px;
}
.resultTbl3 {
margin: 0 auto;
width: 405px;
}
.resultTbl2 th,
.resultTbl3 th {
background-color: #81d1c3;
border: 2px solid #fff;
padding: 11px 20px;
width: 200px;
}
.resultTbl2 td,
.resultTbl3 td {
background-color: #e7e7e7;
border: 2px solid #fff;
padding: 11px 20px;
text-align: right;
}


/**
* submit
**/

.btn_submit {
background: url(../img/lp/bg_btn_submit.png) no-repeat center bottom;
margin: 20px auto 70px;
padding-bottom: 40px;
text-align: center;
}
.btn_submit button {
background: url(../img/lp/btn_submit.png) no-repeat 0 0 transparent;
border: none;
cursor: pointer;
height: 65px;
width: 330px;
}
.btn_submit button:hover {
background-position: 0 -65px;
}


/**
* plot
**/

.boxPlotList {
display: inline-block;
vertical-align: top;
width: 465px;
}
#jqPlot-sample {
display: inline-block;
height: 360px;
margin-top: -10px;
vertical-align: top;
width: 265px;
}


/**
* message
*/

.note {
border: 2px solid #5fc1b0;
line-height: 1.6;
margin: 28px 0;
padding: 15px 40px;
}
.note2 {
border: 1px solid #333;
line-height: 1.7;
padding: 13px 15px;
background-color: #fff;
}
.resultText {
background: -ms-linear-gradient(top, #ffdc7e 0%, #ffc62d 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ffdc7e), color-stop(1, #ffc62d));
background: linear-gradient(to bottom, #ffdc7e 0%, #ffc62d 100%);
background-color: #ffdc7e;
border: 2px solid #ffc62d;
display: inline-block;
font-size: 22px;
font-weight: bold;
margin: 27px auto 16px;
padding: 20px;
}
.caution { line-height: 1.7 }
.cautionIcon {
line-height: 1.7;
margin-left: 15px;
text-indent: -15px;
}
.cautionIcon:before { content: '■' }
.merit {
background-color: #d9f1ed;
line-height: 1.7;
padding: 13px 20px;
}


/**
* banner
**/

#follow .followBody {
padding-left: 14px;
position: relative;
}
#follow.fixed .followBody {
bottom: 0;
position: fixed;
}
.followBody img { vertical-align: bottom }
.followBody a {
background: url(../img/lp/btn_mail.png) no-repeat transparent 0 0;
bottom: 4px;
display: block;
left: 853px;
position: absolute;
right: 4px;
top: 4px;
}
.followBody a:hover { background-position: 0 -72px }