@import (once) "font.less";
@import (once) "default.less";

/* about ///////////////////////*/
.about{

li{
padding:.3rem;
}

li .wrap{
.tac;
padding:1rem;
background:#FFF;
.r(1rem);
}

}


/* kenkou ///////////////////////*/
.kenkou{
.image{
max-width:400px;
.center;
}

dd{
.vam;
}

li{
padding:.5rem 0 0 0;
border-bottom:1px @c3 solid;
}
}


/* chara ///////////////////////*/
.chara{
max-width:250px;
.center;
}


/* kensa ///////////////////////*/
.kensa{

.col2 ul{
width:102%;
margin-left:-1%;
}
.col2 li{
padding:.5rem;
}

}



/* result ///////////////////////*/
/* モーダル本体（初期は非表示） */
.result{
position: fixed;
inset: 0;
display: none;
z-index: 9999;
align-items: center;
justify-content: center;
padding:0 1rem;
}

/* 表示状態 */
.result.is-open{
display: flex;
}

/* 背景の暗幕 */
.result::before{
content:"";
position: absolute;
inset: 0;
background: rgba(0,0,0,.5);
}

/* 中身 */
.result .wrap{
position: relative;
width: min(720px, calc(100% - 32px));
background: #fff;
border-radius: 12px;
padding: 4rem 1rem 1rem 1rem;
box-shadow: 0 10px 30px rgba(0,0,0,.25);
}

/* 結果 */
.result ul{
.dt;
width:100%;
}
.result li{
.dtc;
.vat;
}
.result .chara{
.tac;
}
.result .chara img{
max-width: 220px;
height: auto; 
display: block; 
}

.result h4{
.bg4;
font-size:1.2rem;
color:@c5;
padding:.75rem 0 .75rem 1rem;
.bold;
}

.result h4 b{
.dib;
font-size:1.6rem;
padding:0 .5rem;
}

.result .text{
padding:1rem 0;
}

/* 閉じるボタン */
.result .close{
position: absolute;
top: 10px;
right: 10px;
border: 0;
background: transparent;
font-size: 3rem;
line-height: 1;
cursor: pointer;
}


@media (max-width:800px) {
.result li{
.db;
}
}