@charset "UTF-8";

.center-slide{
padding: 0;
margin: 0 25px;
box-sizing: border-box;
}
.center-slide-inner{
position: relative;
background: #fff;
border-radius: 5px;
padding: 20px 20px 20px 150px;
width: 90%;
min-height: 180px;
display: flex;
align-items: center;
}
.center-slide-inner img{
position: absolute;
width: 160px;
height: 160px;
object-fit: cover;
left: -30px;
top: 0;
bottom: 0;
margin: auto;
border-radius: 100px;
}
.center-slide-inner img + p{
color: #C20064;
font-size: 20px;
font-weight: bold;
line-height: 1.2;
text-align: left;
margin: 0 0 20px;
}
.center-slide-inner img + p + p{
font-size: 16px;
line-height: 1.8;
text-align: left;
}
@media (max-width: 768px) {
.center-slide-inner{
display: block;
padding: 20px;
}
.center-slide-inner img{
position: unset;
}
.center-slide-inner img + p{
font-size: 18px;
line-height: 1.5;
margin: 15px 0 0;
}
.center-slide-inner img + p + p{
font-size: 15px;
line-height: 1.7;
margin: 10px 5px 0;
}
}
.symptom{
padding: 115px 0 85px;
}
.symptom h2{
text-align: center;
font-size: 30px;
letter-spacing: 0.05rem;
}
.symptom .bg_txt2{
position: relative;
color: #fff;
width: fit-content;
margin: 25px auto 0;
padding: 15px 25px;
font-size: 30px;
font-weight: bold;
letter-spacing: 0.05rem;
line-height: 1.3;
background: linear-gradient(45deg, #C20064, #D0155B, #DB2852, #E53B47, #EB4D3C, #F0602F, #F1721E, #F08500);
}
.symptom .symptoms-wrapper{
display: flex;
flex-wrap: wrap;
gap: 15px;
margin: 30px 0 0;
}
.symptom .symptoms-wrapper .symptoms-box{
width: calc((100% - 30px) / 3 );
}
.symptom .symptoms-wrapper .symptoms-box .title{
position: relative;
display: flex;
width: 100%;
gap: 20px;
align-items: center;
margin: 0;
padding: 15px 30px;
background-color: #C20064;
color: #fff;
border-radius: 5px 5px 0 0;
cursor: pointer;
}
.symptom .symptoms-wrapper .symptoms-box .title:after{
position: absolute;
content: "";
background: url(//curepro.jp/misato/wp-content/themes/misato/assets/images/common/icon-plus-white.svg) no-repeat center center;
background-size: contain;
width: 22px;
height: 22px;
top: 0;
bottom: 0;
margin: auto;
right: 26px;
}
.symptom .symptoms-wrapper .symptoms-box.is-open .title:after{
background: url(//curepro.jp/misato/wp-content/themes/misato/assets/images/common/icon-minus-white.svg) no-repeat center center;
background-size: contain;
}
.symptom .symptoms-wrapper .symptoms-box .title img{
width: auto;
height: 50px;
margin: 0;
}
.symptom .symptoms-wrapper .symptoms-box .title p{
font-size: 20px;
font-weight: bold;
letter-spacing: 0;
}
.symptom .symptoms-wrapper .symptoms-box ul{
display: none;
flex-wrap: wrap;
gap: 20px;
background-color: #fff;
border-radius: 0 0 5px 5px;
padding: 20px 40px;
}
.symptom .symptoms-wrapper .symptoms-box.is-open ul{
display: flex;
}
.symptom .symptoms-wrapper .symptoms-box ul li{
position: relative;
padding: 0 0 0 18px;
}
.symptom .symptoms-wrapper .symptoms-box ul li:before{
position: absolute;
content: "";
width: 8px;
height: 8px;
background-color: #C20064;
border-radius: 50px;
top: 0;
bottom: 0;
left: 0;
margin: auto;
}
.symptom .search-btn{
margin: 60px auto 0;
}
.symptom .search-btn a{
display: block;
width: fit-content;
margin: 0 auto;
padding: 20px 70px;
background-color: #C20064;
border-radius: 35px;
color: #fff;
font-size: 23px;
font-weight: bold;
letter-spacing: -0.05rem;
}
.about h2{
font-size: 40px;
text-align: center;
letter-spacing: 0;
}
.symptom > img{
display: block;
width: 711px;
margin: -80px auto -26px;
}
.symptom > img.sp{
display: none;
}
@media (max-width: 768px){
.symptom h2{
font-size: 20px;
}
.symptom h2{
font-size: 18px;
line-height: 1.5;
padding: 0 40px;
}
.symptom .inner{
padding: 0 20px;
}
.symptom .bg_txt2{
position: relative;
margin: 10px auto 0;
font-size: 20px;
line-height: 1.5;
padding: 15px 25px;
max-width: 350px;
white-space: nowrap;
}
.title p:first-child{
font-size: 57px;
}
.title p:nth-child(2){
font-size: 20px;
}
.symptom > img{
position: relative;
width: 600px;
left: 50%;
transform: translateX(-50%);
}
.symptom .s_list{
padding: 0 30px 17px;
}
.symptom .s_list div p{
width: 100%;
color: #fff;
background: linear-gradient(45deg, #C20064, #D0155B, #DB2852, #E53B47, #EB4D3C, #F0602F, #F1721E, #F08500);
padding: 4px 0 4px 10px;
font-size: 14px;
margin: 0 0 5px;
}
.symptom .s_list div:not(:first-child){
margin: 10px 0 0;
}
.symptom .s_list div ul{
display: flex;
flex-wrap: wrap;
gap: 5px 10px;
}
.symptom .s_list div ul li{
font-size: 14px;
}
.symptom .sp_txt{
margin: 50px 35px;
text-align: center;
}
.symptom .sp_txt div{
display: flex;
justify-content: center;
gap: 5px;
align-items: flex-end;
}
.symptom .sp_txt div img{
width: 289px;
}
.symptom .sp_txt div p{
font-size: 25px;
font-weight: bold;
color: #C20064;
}
.symptom .sp_txt > p{
color: #C20064;
font-size: 30px;
font-weight: bold;
}
.symptom{
padding: 30px 0 0;
overflow: hidden;
}
.symptom .symptoms-wrapper{
display: grid;
padding: 0;
margin: 20px 0 0;
}
.symptom .symptoms-wrapper .symptoms-box{
width: 100%;
}
.symptom .symptoms-wrapper .symptoms-box .title{
gap: 15px;
}
.symptom .symptoms-wrapper .symptoms-box .title img{
height: 35px;
}
.symptom .symptoms-wrapper .symptoms-box .title p{
font-size: 17px;
}
.symptom .symptoms-wrapper .symptoms-box ul{
padding: 20px;
gap: 10px 15px;
}
.symptom .search-btn{
margin: 30px auto 50px;
}
.symptom .search-btn a{
width: 100%;
text-align: center;
line-height: 1;
letter-spacing: 0.05rem;
font-size: 18px;
font-weight: 500;
padding: 15px 20px;
}
.symptom .symptoms-wrapper .symptoms-box .title:after{
width: 20px;
height: 20px;
}
}