body {
    background-color: #f4f4f9;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;

    font-family: "A+EqpB-游ゴシック体 Pr6N M", "Yu Gothic", 游ゴシック体, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, verdana, sans-serif;
    width: 100%;
    color: #4D4D4D;
    margin: 0;
    padding: 0;
   
}
/* プリント時の背景color */
body, .container {
  -webkit-print-color-adjust: exact !important;
  print-color-adjust: exact !important;
  background-color: #f4f4f9 !important;
}


li{
    padding: 0;
    margin: 0;
    list-style-type: none;
}
.logo {
    margin-left: 30px;
    margin-top: 28px;
}
.logo img{
    width: 150px;
}
/*ーーーーーー 類似prompt枠の色サイズ設定ーーーーーー */
.info,.marriageinfo,
.howtoworkinfo,
.childreninfo,
.childrenageinfo,
.pregnancyinfo,
.futureworkinfo,
.agetoworkinfo,
.wantchildreninfo,
.nomwantchildreninfo,
.nombchildreninfo,
.wantmarriageinfo,
.nomworkinfo,
.nomfutureworkinfo,
.nomagetoworkinfo
{
    zoom: 75%;
    background: #FFE6DC;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    max-width: 1000px;
    width: 650px;
    height: 550px;
    box-sizing: border-box;
/* 絶対位置を作って、浮かせる */
    position: absolute;
    top: 248px;
    left: 520px;
    z-index: 10;

}

.info,
.marriageinfo,
.howtoworkinfo,
.childreninfo,
.childrenageinfo,
.pregnancyinfo,
.futureworkinfo,
.agetoworkinfo,
.wantchildreninfo,
.nomwantchildreninfo,
.nombchildreninfo,
.wantmarriageinfo,
.nomworkinfo,
.nomfutureworkinfo,
.nomagetoworkinfo.active {
    display: block; /* 显示活动框 */
    zoom: 75%; /* 缩放到 75% */
}

/*ーーーーーーーーーーーーー一個目のprompt設定ーーーーーーーーーー */
h1 {
    text-align: center;
}
select{
   
    font-size: 20px;
  
}

 dl {
    margin: 20px 0;
    font-size: 20px;
    display: flex;
}





.block dt {
   
    margin-bottom: 5px;
}



.note {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0.9em;
    color: gray;
}


.nextbtn1 {
    text-align: center;
    
}
.nextbtn {
    text-align: center;
     
}

.skipbtn{
    text-align: right;
    margin-top: -50px;
    font-size: 20px;
   
}
.skipbtn a{
 color: #FF838C;
}



/* ーーーーーーーーーー間隔の調整 ーーーーー*/
.block{
    margin-left: 33%;
    margin-bottom: 90px;
}
.agetoworkblock{
    margin-left: 40px;
    margin-bottom: 215px;

}
.marriageblock{
    margin-left: 35%;
    margin-top: 50px;
}

.childrenblock select{
    margin-left: 335%;
    margin-bottom: 150px;
  
}
.childrenblock{
    margin-top:10%;
}
.childrenageblock{
    margin-top:10%;
    margin-left: 20%;

}
.pregnancyblock select{
   
  
}
.pregnancyblock{
    margin-top:10%;

}
/* 仕事パタン */
.workblock select[name="job"] {
    margin-left: -120%;
}
.workblock select[name="partnerjob"] {
    margin-left: -50%;
}
.workblock{
    margin-left: 17%;

}
.nomworkblock dd{
    display: flex;
}
/*ーーーーーー 次へボックスの設定 ーーーーーー*/
.box_link {
    text-decoration: none;
    padding: 10px 20px;
    background: #FF838C;
    color: white;
    border-radius: 5px;
    transition: background 0.3s ease;
    font-size: 25px;

}

.pdfbox_link{
    padding: 12px 10px;
    background-color: #ff838c;
    border: none;
    border-bottom: 3px solid #eb708c;
    border-radius: 10px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-size: 25px;
}



 dt {
    font-weight: bold;
    margin-right: 10px;
   
}

h2{
    text-align: center;
}
/* ーーーーーー二個目以降のflex設定 ーーーーーー*/
.marriageblock dl{
    display: flex;
    margin-top: 100px;
    margin-bottom: 215px;

}

.childrenblock dl{
    margin-left: -80px;
    display: flex;
    margin-top: 100px;
    margin-bottom: 66px;
   
}
.childrenageblock dl{
    margin-left: -50px;
    margin-bottom: 215px;
    margin-top: 100px;

}
.pregnancyblock dl{
    margin-left: 40px;
    margin-bottom: 185px;
}
.agetoworkblock dl{
    margin-left: 180px;
    margin-top: 100px;
    margin-bottom: 205px;
}
.nomwantchildrenblock dl{
    margin-left: 210px;
    margin-top: 100px;
    margin-bottom: 185px;
}
.nombchildrenblock dl{
    margin-left: 90px;
    margin-bottom: 175px;
    margin-top: 100px;


}
.nomagetoworkblock dl{
    margin-left: 210px;
    margin-top: 100px;
    margin-bottom: 205px;
    
}
.wantmarriageblock dl{
    margin-left: 240px;
    margin-bottom: 205px;
    margin-top: 100px;
}
.workblock dl{
    margin-top: 100px;
    margin-bottom: 210px;

}
.workblock select[name="myjob"] {
    margin-left: -40px;
    margin-right: 30px;
    margin-top: 5px;
  }
  .workblock select[name="partnerjob"] {
    margin-left: -30%;
    margin-top: 5px;
}

.workblock select[name="myFjob"] {
    margin-left: -40px;
    margin-right: 30px;
    margin-top: 5px;
  }
  .workblock select[name="pFjob"] {
    margin-left: -30%;
    margin-top: 5px;
}
.nomfworkblock dl{
    margin-top: 100px;
    margin-bottom: 205px;
    margin-left: 100px;
}
.nomfworkblock select[name="nommyFjob"] {
    margin-left: -40px;
    margin-right: 30px;
    margin-top: 5px;
  }
.nomfworkblock select[name="nompFjob"] {
    margin-left: -30%;
    margin-top: 5px;
}





.pregnancyblock select[name="pregnancychoice"] {
    margin-top: 5px;
}
.pregnancyblock dt{
    margin-left: 70px;
}
.pregnancyblock select[name="pregnancyage"] {
    margin-left: -45px;
    margin-top: 5px;
}



.nomworkblock{
    margin-left: 120px;
    margin-top: 105px;
    margin-bottom: 205px;

}
.nomworkblock select[name="nomjob"] {
    margin-left: -40px;
    margin-right: 30px;
   
  }
.nomworkblock select[name="nompajob"] {
    /* margin-left: -30%; */
}



/*ーーーーーーーーーー 下地 ーーーーーーーーーー*/

/* 年齢タグ */
.container{
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 auto;
    background-size: cover;
    margin-top: 80px;
    zoom: 75%; 
    
    
}
.line-top {
   
    height: 7px;
    background-color:#F98A92;
    left: 0;
    margin-top: 20px; 
    margin-bottom: 20px; 
}

.arrow{
    display: flex;
    float: right;
    margin-left: 210px;
    margin-top: -125px;
    height: 80px;
}
/* .arrow > div {
    margin-right: 5px;
} */
.top{
    width: 1680px;
    margin-top: 30px;
}

/*ーーーーーーーーーーthead 左側のタグ調整 ーーーーーーーーーー*/
.thead{
    clear: right;
    flex: 30%;
    margin-top: 20%;
    margin-right: 55px;

}
.thead div {
    margin-bottom: 20px; /*中の小さいDIV上下間隔調整 */
    height: 93px;
}
.thead img{
    width: 15%;
}




 .age10,.age20,.age30,.age40,.age50,.age60,.age70,.age80,.age90,.age100{
        display: flex;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: center;
        font-weight: 600;
        border-radius: 30px;
        width: 240px;
        font-size: 20px;
        margin-left: 5px;
    
}
.age20{
    background: #FFE6DC;
}
.age30{
   background:  #FFA7AB;
}
.age40{
    background: #FF838C;
}
.age50{
    background: #EB708C;
}
.age60{
    background: #FFE6DC;
}
.age70{
    background:#FFA1AB;
}

.riskofdisease,.healthcheckup,.family,.work,.ninshinandshusan,.kekon,.patona{
    display: flex;
    font-weight: 600;
    background: #FFE6DC;
    border-radius: 10px;
    align-items: center;
    justify-content: center;
    width: 200px;
    font-size: 20px;
    height: 13%;


}





/*ーーーーーーーーーーrightcontents右側の調整 ーーーーーーーーーー*/
#sheet {
    display: flex;
    flex-direction: row;
    margin-top: -325px;
}

.rightcontents {
    flex: 80%;
    margin-top: 20%;
    font-size: 12.5px;
}
.right1and2frame {
    border: 1px ;
    padding: 10px;
    width: 1450px;
   
    border-radius: 10px;
    background-color: rgb(237, 240, 242);
    margin-left: -40px;
  
}
.frame3{
    border: 1px;
    padding: 10px;
    width: 1450px;
    height: 67px;
    border-radius: 10px;
    background-color: rgb(237, 240, 242);
    margin-top: 20.5px;
    margin-left: -40px;
    height: 74px;
}

.frame4{
    border: 1px;
    padding: 10px;
    width: 1450px;
    height: 67px;
    border-radius: 10px;
    background-color: rgb(237, 240, 242);
    margin-top: 19px;
    margin-left: -40px;
    height: 74px;

}
.frame5{
    border: 1px;
    padding: 10px;
    width: 1450px;
    height: 67px;
    border-radius: 10px;
    background-color:rgb(237, 240, 242);
    margin-top: 19px;
    margin-left: -40px;
    height: 74px;
}
.frame6{
    border: 1px;
    padding: 10px;
    width: 1450px;
    height: 67px;
    border-radius: 10px;
    background-color: rgb(237, 240, 242);
    margin-bottom: 30px;
    margin-top: 19px;
    margin-left: -40px;
    height: 74px;
}
/* ----------------右側コンテンツ１，２ ----------------*/
#content1and2{
    display: flex; /* 使用 flexbox 布局 */
    flex-wrap: wrap; /* 如果子元素太多则换行 */
    justify-content: space-between; /* 子元素之间的间距 */
    height: 185px;
    font-size: large;

  
}
.firstline, .secondline {
    display: flex;
    justify-content: space-between;

}
.secondline{
    margin-top: -35px;
}
.lifeli {
    list-style-type: disc;
    list-style-position: inside;
    color: black; /* 文字色を黒にする */
}
.c_30_1 li{
    margin-left: 70px;
    margin-top: 20px;
}
.c_30-1 li{
    margin-left: -30px;
}
.c_40 li{
    margin-left: 60px;
}
.c_40-1 li{
margin-left: -10px;
}
.c_50 li{
    margin-left: 35px;
}
.firstline li::marker {
    color: pink; /* ・だけ色変える */
}
.btn{
    display: flex;
    font-weight: 600;
    background: #FFE6DC;
    border-radius: 10px;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    padding: 20px;

}
a{
    text-decoration: none;
}




/* データ表示 */
#workvaluedata:empty {
    display: none; /* 隐藏没有内容的 */
}



#workvaluedata {
    
   
    position: absolute;
    
    display: inline-block;
    background-color: grey;
    font-size: larger;
    font-weight: 600;
    color: white;
    padding: 0 20px;

}

#workvaluedata:after {
    position: absolute;
    content: '';
    border-width: 15px 0 15px 8px;
    border-style: solid;
    border-color: transparent transparent transparent grey;
    margin: 0 20px;

}



#valuedata:empty {
    display: none; 
}


#valuedata{
   
    position: absolute;
   
    display: inline-block;
    background-color: #FFE6DC;
    font-size: larger;
    font-weight: 600;
    margin: 0 20px;
    
}

#valuedata::after{
    position: absolute;
    content: '';
    border-width: 15px 0 15px 12px;
    border-style: solid;
    border-color: transparent transparent transparent #FFE6DC;
   

}
#kekonvaluedata{
    position: absolute;
   
    display: inline-block;
    background-color: #FFE6DC;
    font-size: larger;
    font-weight: 600;
    padding: 0 20px;

}
#kekonvaluedata:after {
    position: absolute;
    content: '';
    border-width: 15px 0 15px 8px;
    border-style: solid;
    border-color: transparent transparent transparent #FFE6DC;
    margin: 0 20px;

}

#content3 span:empty {
    display: none; /* 隐藏没有内容的  */
}



.personalinfo{
    width: 200px;
    background:  rgb(237, 240, 242);
    align-items: center;
    align-items: center;
    border-radius: 10px;
    text-align: center;

}


.personalinfo h4{
    margin-bottom: auto;
}

/* tableの間隔設定 */




.table{
   position: absolute;
    margin-top: 420px;
    margin-left: 220px;
}


#shusanimg{
    width: 25px;
    margin-bottom: -5px;
}
.butn{
    margin-top: 50px;
    display: flex;
    justify-content: center;
    margin-bottom: -50px;
}

th, td {
    
    width: 116px;
    overflow: hidden; 
    height: 35px;
    text-overflow: ellipsis; 
}

.trninshin{
    height: 40px;
}
.trshusan{
    height: 40px;
}
.trkekon{
    height: 145px;
}
.trpatona{
    height: 75px;
}
.trwork{
    height: 155px;
}

body {
    opacity: 0;
    animation: fadeIn 0.3s ease-in forwards;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}