@charset "UTF-8";

/*------------------------------
Backache
------------------------------*/
.causemov{
    margin-bottom: 2em;
}
.causemov ul{
    width: 90%;
    text-align: left;
    margin: auto;
    list-style-type: circle;
}
.cause{
    text-align: left;
    background-color: #ffffff;
    margin: 2em 0;
}
.cause dt{
    padding: 0.6em;
    color: #014880;
    font-size: 1.1em;
}
.cause dd{
    line-height: 2; 
    background-image: linear-gradient(to bottom, #ccc 1px, transparent 1px);
    background-repeat: repeat-y;
    background-size: 100% 2em; 
    padding:0 0.6em; 
}
.box1, .box2{
    text-align: left;
    margin: 3em 0;
}
.box1::after,
.box2::after{
    content: "";
    display: block;
    clear: both;
}
.box1 img {
    width: 40%;
    height: auto;
    float: left;
    margin: 0 20px 10px 0;
}
.box2 img {
    width: 30%;
    height: auto;
    float: right;
    margin: 0 0 10px 20px;
}
.box3{
    display: flex;
}
.pcclm2 .img_backahe01{
    width:90%;
    margin: auto;
}
.pcclm2 .img_backahe02{
    width:55%;
    margin: auto;
}
.pcclm2 .img_backahe03{
    width:80%;
    margin: auto;
}

@media screen and (min-width: 768px) {
    .causemov ul{
        width: 60%;
    }
    .pcclm2 .img_backahe01{
        width:70%;
        margin: auto;
    }
    .pcclm2 .img_backahe02{
        width:40%;
    }
    .pcclm2 .img_backahe03{
        width:80%;
        margin: auto;
    }
}
@media screen and (min-width: 1200px) {
    .secbox{
        max-width: 1000px;
        margin: 0 auto;
    }
    .cause{
        margin: 1em 0;
    }
    .box1 img {
        width: 30%!important;
    }
    .pcclm2{
        display: flex;
    }
    .pcclm2 dl{
        width: 70%;
    }
    .pcclm2 figure{
        flex:1;
        margin: 1em 0 0 1em;
    }
    .pcclm2 .img_backahe01,
    .pcclm2 .img_backahe02,
    .pcclm2 .img_backahe03{
        width:100%;
        margin-left: 1em;
    }
    
    .box1, .box2{
        margin: 3em 0 5em;
    }
}

/*------------------------------
Hernia
------------------------------*/
.box4, .box5{
    margin: 1em 0 2em;
}
.box4 p,
.box5 p{
        text-align: left;
    }
.listbox ul{
    width: 90%;
    margin: auto;
    text-align: left;
}
.listbox li{
    border-bottom: 1px solid #ccc;
    padding: 0.3em 0.5em;
    list-style-type: circle;
}
.listbox2 {
    margin: 2em auto 4em;
}
.listbox2 ul{
    width: 90%;
    margin:auto;
    text-align: left;
}
.listbox2 li{
    border-bottom: 1px solid #ccc;
    padding: 0.3em 0.5em;
    list-style-type:decimal;
}
.listbox li a{
    text-decoration: none;
}
.pic-hernia4{
    width: 90%;
}
@media screen and (min-width: 768px) {
    .pic-hernia4{
        width: 50%;
    }
    .box1 img.pic-sciatica1{
        width: 20%!important;
    }
    
}
@media screen and (min-width: 1200px) {
    .box4{
        display: flex;
        margin: 2em 0 5em;
    }
    .box4 img {
        width: 40%!important;
    }
    .box4 p{margin-left: 1em;}
    .box5{
        display: flex;
        margin: 2em 0 5em;
    }
    .box5 div:first-child{
        width: 60%;
    }
    .box5 div:last-child{
        width: 40%;
    }
    .pic-hernia4{
        width: 40%;
    }
}