@charset "UTF-8";
/* =========================================================
  #htcheck_iframe
========================================================= */
#htcheck_iframe { background: #FFF; width: 100%; margin: 0 auto 0; }
#htcheck_iframe .inner { margin: 0px auto; max-width: 1200px; }
#htcheck_iframe .content{ background-color: #edfaff; border-radius: 10px; margin: 0 auto; padding: 40px; }
#htcheck_iframe .content_inner { display: flex; align-items: flex-start; justify-content: space-between; }
#htcheck_iframe .txt_area { width: 32.33%; }
#htcheck_iframe .txt_area img { margin-bottom: 33px; }
#htcheck_iframe .txt_area p { font-size: 1.6rem; line-height: 1.88; margin-top: 15px; }
#htcheck_iframe .txt_area p:nth-of-type(1) { margin-top: 0; }
#htcheck_iframe .htcheck_area { border-radius: 10px; background-color: #fff; width: 64%; padding:30px; margin-left: auto;}

#htcheck_iframe dl { padding: 14px 0; display: flex; align-items: flex-start; justify-content: left; align-items: center; border-bottom: 1px solid #E5E5E5; }
#htcheck_iframe dl:first-of-type{padding:0 0 14px 0;}
#htcheck_iframe dl:last-of-type { border-bottom: none; }
#htcheck_iframe dt { width: 94px; font-weight:normal; }
#htcheck_iframe dd ul { display: flex; align-items: flex-start; justify-content: left; }
#htcheck_iframe dd li { display: flex; align-items: center; justify-content: left; width: 150px; height: 40px; margin: 0; border-radius: 5px; border: solid 1px #e4e4e4; background-color: #f9f9f9; }
#htcheck_iframe dd li:last-of-type { margin: 0 0 0 10px; }
#htcheck_iframe .form-control { font-size: 1.6rem; padding: 5px; width: 150px; height: 40px; margin: 0; border-radius: 5px; border: solid 1px #e4e4e4; background-color: #f9f9f9;  background-image: url('../images/form_select_yazirushi.svg'); background-size:auto; background-position:90% 55%; background-repeat: no-repeat;}
#htcheck_iframe .birth_month{ margin: 0 20px; }
#htcheck_iframe .flex_content{display: flex; justify-content: space-between; align-items: end;}
#htcheck_iframe .flex_content_inner{display: flex; justify-content: space-between; align-items: end;}
#htcheck_iframe  span { font-size: 1.4rem; display: block; margin-left:10px;}
#htcheck_iframe .height ,
#htcheck_iframe .weight {font-size: 1.6rem ; padding: 5px; width: 150px; height: 40px; border-radius: 5px; border: solid 1px #e4e4e4; background-color: #f9f9f9; }
/*radio*/
input[type=radio] { display: none; }
label:focus:before, label:hover:before, label:active:before, input:checked + label:before { border-color:#1F87F9 ; }
label[for]{ width: 100%; height:100%; padding: 11px 0 0 33px;}
label { font-size: 1em; font-weight: normal; line-height: 1; position: relative; display: block; overflow: hidden; padding:0 0 0 20px; cursor: pointer; -webkit-transition: all 0.15s ease; transition: all 0.15s ease; white-space: nowrap;}
label:before { position: absolute; top: 12px; left: 13px; width: 14px; height: 14px; content: ''; background: #ffffff; border: 1px solid #BBBBBB; border-radius: 50%; }
input:checked + label:before { border: 4px solid #1F87F9 ; background: #ffffff; }
input:disabled + label { cursor: not-allowed; color: rgba(0, 0, 0, 0.5); }
input:disabled + label:hover { border-color: rgba(0, 0, 0, 0.1); }
input:disabled + label:before { border-color: #ffffff; background: #ffffff; }
/*calendar*/
input[type="date"] {font-size: 1.6rem ; padding: 5px;  width: 150px; height: 40px; position: relative; border-radius: 5px; border: solid 1px #e4e4e4; background-color: #f9f9f9; background-image: url('../images/ico_calendar.svg'); background-repeat: no-repeat; background-size: 20px; background-position: 90% center;}
input[type="date"]::-webkit-calendar-picker-indicator { position: absolute; width: 100%; height: 100%;background: transparent; z-index: 1; }
@-moz-document url-prefix() {input[type="date"] { background-image: none; }}

/*submit*/
button, input[type="submit"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; padding: 0; border: none; outline: none; background: transparent; }
.btn { width: 200px; height: 35px; display: block; text-align: center; margin: 15px auto 0; border-radius: 18px; background-color: #0bb0ed; color: #FFF; cursor: pointer; }

@media screen and (max-width:1280px) {
    #htcheck_iframe .inner { width: 97vw; }
    #htcheck_iframe .inner img { width: 100%; }
}

@media screen and (max-width:1240px) {
    #htcheck_iframe .flex_content{display:block;}
    #htcheck_iframe .flex_content_inner{display:flex;}
    #htcheck_iframe .birth_month{ margin: 10px 0; }
}

@media only screen and (max-width:768px) {
    #htcheck_iframe { width: 100vw; margin: 0 auto 0; scroll-margin-top: 16vw; }
    #htcheck_iframe .inner { width: 100%; }
    #htcheck_iframe .content{  padding: 0 0 4vw 0;}
    #htcheck_iframe .content_inner{display: block;}
    #htcheck_iframe .txt_area{ width: 92vw; margin:0 auto; }
    #htcheck_iframe .txt_area img { margin:0 auto 10vw; padding: 10vw 0 0 0; width:61.333vw;  display: block;}
    #htcheck_iframe .txt_area p { font-size: 3.733vw; margin-top:3vw; }
    #htcheck_iframe .txt_area p:nth-of-type(110) { margin-top: 0; }
    #htcheck_iframe .htcheck_area { border-radius: 10px; width: 64%; padding:30px; margin-left: auto;}
    #htcheck_iframe .htcheck_area{  width: 92vw;  padding:4vw 4vw 8vw 4vw; margin: 8vw auto 0;}
    #htcheck_iframe dl { padding: 0 0 5.333vw 0; display: block; border-bottom: none; }
    #htcheck_iframe dl:first-of-type{padding: 0 0 5.333vw 0;}
    #htcheck_iframe dt { width: 100%; font-size: 3.7333vw; margin-bottom: 2.66666vw;}
    #htcheck_iframe dd li {width: 40vw; height: 10.66vw; padding-left:0;}
    #htcheck_iframe dd li:last-of-type { margin: 0 0 0 4vw; }
    #htcheck_iframe .form-control { font-size: 3.7333vw; padding: 1.333vw; width: 26.666vw; height: 10.66vw;}
    #htcheck_iframe .birth_month{ margin: 0 1vw; }
    #htcheck_iframe .dl_dob select{width:26.6666vw;}
    #htcheck_iframe .dl_dob .flex_content{display:flex;}
    #htcheck_iframe .dl_dob .flex_content span{display: none;}
    #htcheck_iframe .birth_month{ margin: 0; }
    #htcheck_iframe .flex_content_inner{justify-content:space-between;}
    #htcheck_iframe span { font-size: 3.733vw; margin-left:0;}
    #htcheck_iframe .height ,
    #htcheck_iframe .weight {font-size: 3.733vw; padding: 1.333vw; width: 76vw; height: 10.66vw; }
    /*radio*/
    input[type=radio] { display: none; }
    label[for]{padding: 3.2vw 0 0 9.866vw;}
    label { font-size:  3.733vw; padding:0 0 0 6vw; }
    label:before { width: 3.733vw; height: 3.733vw; top: 3.2vw; left: 3.73vw;}
    input:checked + label:before { border: 1.2vw solid #1F87F9 ; }
    /*calendar*/
    input[type="date"] {font-size: 3.733vw; padding: 1.333vw;  width: 76vw; height: 10.66vw; background-position: 68vw center;}
    /*submit*/
    #htcheck_iframe .btn {  font-size: 3.733vw; width: 53.333vw; height: 9.3333vw; margin: 3vw auto 0; border-radius: 4.8vw;}
}

/* =========================================================
  #htcheck_iframe Result
========================================================= */
#htcheck_iframe.result .txt_area img{ width: 300px;}
#htcheck_iframe.result span{ display: initial; margin-left: 0;font-size: 2rem; color: #FF386F; font-weight: bold;}
#htcheck_iframe.result span.result_txt{display: block;}
#htcheck_iframe.result .underline{text-decoration: underline; }
#htcheck_iframe.result .btn.born{width: 100%; margin: 10px auto 0;}
#htcheck_iframe.result .result_area{border-radius: 10px; background-color: #fff; padding: 20px; margin-top: 30px; font-size: 1.6rem;}
#htcheck_iframe.result .result_area p{margin:18px 0 0 0; line-height:1;}

.table_rult {margin-top:17px; width: 100%; border: 1px solid #71d5f8; border-radius: 5px; border-collapse: separate; border-spacing: 0; overflow: hidden; }
.table_rult .re01{margin-top: 22px; display: block;}
.table_rult th { border-right: 1px solid #71d5f8; font-weight:normal; }
.table_rult th, .table_rult td { padding: 9px; border-top: 1px solid #71d5f8;}
.table_rult tr { border-top: 1px solid #71d5f8; }
.table_rult td{text-align:right;}
.table_rult td.tab-color{border-right:1px solid #71d5f8; background: #F0FBFE; }
.table_rult tr:first-child th ,
.table_rult tr:first-child td{ border-top:none;}
.table_rult tr:first-child td{text-align:center;}

#htcheck_iframe.result .htcheck_area{position:relative; padding: 0 30px;}
#htcheck_iframe.result .htcheck_area img{margin: 0 auto; display: block;}
.guardian-bg{margin-top:30px;font-size: 1.4rem; display: flex; justify-content: left; flex-wrap: wrap; align-items: baseline;}
.guardian-bg strong{margin:0 20px 0 0; display: block;}
.guardian-bg p{line-height: 1.86;}
.message{ border-radius: 10px; background-color: #fff; padding: 12px 20px 20px 20px; font-size: 1.4rem; line-height: 1.86; margin-top: 30px; text-align: justify;}

@media screen and (max-width:1280px) {
    #htcheck_iframe.result .txt_area img{width: 100%; max-width:300px;}
    #htcheck_iframe.result .txt_area{width: 42%;}
    #htcheck_iframe.result .htcheck_area{width: 56%;}
    .guardian-bg strong{margin-bottom:10px;}
    .guardian-bg p{line-height:1.5;}
}

@media screen and (max-width:768px) {
    #htcheck_iframe.result .txt_area img{width: 75.2vw; max-width:inherit;margin: 0 auto 9vw;}
    #htcheck_iframe.result { width: 100vw; margin: 0 auto 0; scroll-margin-top: 16vw; }
    #htcheck_iframe.result .inner { width: 100%; }
    #htcheck_iframe.result .content{  padding: 0 0 4vw 0;}
    #htcheck_iframe.result .content_inner{display: block;}
    #htcheck_iframe.result .txt_area{ width: 92vw; margin:0 auto; }
    #htcheck_iframe.result .htcheck_area{width: 92vw; margin:5.33vw auto 0; padding: 2.666vw 5.333vw; }

    #htcheck_iframe.result span{font-size: 4.8vw;}
    #htcheck_iframe.result .btn.born{ margin: 4vw auto 0;}
    #htcheck_iframe.result .result_area{padding: 5.333vw; margin-top: 8vw; font-size: 3.733vw;}
    #htcheck_iframe.result .result_area p{margin:4.5vw 0 0 0;}

    .table_rult {margin-top:4.5333vw;}
    .table_rult .re01{margin-top: 22px; }
    .table_rult th, .table_rult td { padding: 2.6vw;}
    .table_rult tr { border-top: 1px solid #71d5f8; }
    .table_rult td{text-align:right;}
    .table_rult td.tab-color{border-right:1px solid #71d5f8; background: #F0FBFE; }
    .table_rult tr:first-child th ,
    .table_rult tr:first-child td{ border-top:none;}
    .table_rult tr:first-child td{text-align:center;}

    .guardian-bg{font-size: 3.733vw; display: block; width: 92vw; margin: 22.66666vw auto 0;}
    .guardian-bg strong{margin-right: 0; }
    .message{ padding: 5.333vw; font-size: 3.733vw; margin: 8vw auto 0; width: 92vw; line-height: 1.71;}
}


/* =========================================================
  #印刷ボタン
========================================================= */
#htcheck_iframe .btn.print{position:absolute; top: 10px; right: 10px; width: 95px; text-indent: 25px; margin: 0;}
#htcheck_iframe .btn.print{ background-image: url('../images/ico_print.svg'); background-repeat: no-repeat; background-size: 16px; background-position: 22% center; }

@media only screen and (max-width:768px){
    #htcheck_iframe .btn.print{ top: auto; bottom: -14.933vw; right: 0; left: 0; margin:0 auto; width: 25.33vw;}
    #htcheck_iframe .btn.print{ background-size: 4.266vw; background-position: 22% center; }
}


/* =========================================================
  #印刷画面用css
========================================================= */
/* 横向き印刷指定 */
@page { size: A4 landscape; }
@media print {
    body {-webkit-print-color-adjust: exact;/*chrome & webkit browsers*/ color-adjust: exact; /*firefox & IE */ }
    body{zoom: 80%;}
    
	
    #htcheck_iframe .btn.print{display: none;}
    
    .table_rult tr:first-child td{padding:9px 0;}
}





