@charset "UTF-8";

/*----------------------------------------
 comfort
----------------------------------------*/

.comfort_bg{
background-image: url(../images/comfort_bg.jpg);
background-size: 100%;
background-position: bottom center;
background-repeat: repeat-y;
}


.comfort_main{
width: 100%;
display: flex;
justify-content: center;
align-items: flex-start;
flex-wrap: wrap;
}

.comfort_main_inner{
width: 100%;
max-width: 1024px;
display: flex;
justify-content: center;
align-items: flex-start;
flex-wrap: wrap;
}

.comfort_main h2{
font-family: YakuHanMP, "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif;
font-size: 3rem;
line-height: 1;
font-weight: 400;
display: inline-block;
width: 100%;
margin: 60px 0 10px 0;
padding: 0 0;
letter-spacing: 0;
text-align: center;
color: #333;
}

.comfort_main h3{
font-size: 1.7rem;
color: #324e65;
}

.comfort_main p{
font-family: "sheila", sans-serif;
font-weight: 700;
font-style: normal;
font-size: 3rem;
color: #324e65;
}

h3.comfort_title{
font-size: 2rem;
font-weight: normal;
display: inline-block;
margin: 0 0 40px 0;
padding: 10px;
text-align: center;
width: 100%;
background-color: #eae8db;
}

.comfort_box{
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
width: 100%;
}


.comfort_box h4{
text-align: left;
color: #324e65;
margin: 0 0 10px 0;
}


.comfort_box h4 img{
width: 30px;
margin-right: 10px;
position: relative;
top: -2px;
}


.comfort_box p{
font-size: 1.4rem;
line-height: 1.7;
}

.comfort_box_inner{
width: 49%;
}

.comfort_box_inner2{
width: 32.3333333333333333%;
}

.comfort_box_inner3{
width: 65.3333333333333333%;
}

.comfort_box_fix{
position: sticky !important;
top: 150px;
}

.comfort_CL{
color: #324e65;
}

.js-scrollable{
width: 100%;
}

.js-scrollable img{
width: 100% !important;
}


@media screen and (max-width : 767px) {


.comfort_main_inner{
width: 100%;
max-width: 100%;
}

.comfort_main h2{
font-size: 2.5rem;
margin: 40px 0 10px 0;
}

.comfort_main h3{
font-size: 1.3rem;
}

h3.comfort_title{
font-size: 1.6rem;
margin: 0 0 20px 0;
}


.comfort_box_inner{
width: 100%;
}

.comfort_box h4{
font-size: 1.6rem;
}

.comfort_box p{
font-size: 1.3rem;
line-height: 1.5;
}

.comfort_box_fix{
position: static !important;
top: 0;
}

.comfort_box_inner2{
width: 100%;
}

.comfort_box_inner3{
width: 100%;
}

.js-scrollable img{
width: 210% !important;
}

}