:root{
    --midashi-bg:#556a98;
    --gray-bg:#f8f8f9;
}

/****
基本情報
****/

html{
	font-size:62.5%;
}

body{
	font-size:1.8rem;
	font-family:'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','Meiryo','メイリオ','Yu Gothic Medium','游ゴシック Medium', sans-serif;
	line-height:1.8;
	color:#333333;
    overflow-x: hidden;
}

.clear{
    clear:both;
}

a{
    color:#4a63d1;
}

a:visited{
    color:#4a63d1;
}

a:hover{
    color:#4a63d1;
    opacity: 0.9;
}

a:visited{
    color:#4a63d1;
}

@media print, screen and (min-width:641px){
.pc_only{
}

.sp_only{
    display:none !important;
}
}

@media screen and (max-width:640px){
.pc_only{
    display:none !important;
}

.sp_only{
}
}
    

/*******
index.html
********/

header{
    width:1200px;
    display:flex;
    justify-content: space-between;
    align-items: center;
    background:#ffffff;
    position: absolute;
    left:0;
    right:0;
    top:2.60416vw;
    border-radius: 15px;
    margin:0 auto;
    padding:15px 30px;
    box-sizing: border-box;
    z-index: 100;
    box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.3);
}

header h1{
    width:170px;
}

header .home-logo{
    width:350px;
}

header .home-logo img{
    width:100%;
}

.slider-wrap{
    position: relative;
    margin-bottom:70px;
    min-width: 1240px;
}


.slider li img{
    width:100%;
    z-index: -1;
    object-fit: cover;
}

.catchcopy{
    position: absolute;
    top:18.22916vw;
    right:18.22916vw;
}

.catchcopy img{
    width:29.6875vw;
}

.add-animation {
    /* アニメーション名 アニメーションにかかる時間 アニメーションの実行前後の状態 */
    /* zoom-fade 10秒 [実行前]最初のキーフレーム（0%） → [実行後]最後のキーフレーム（100%） */
    animation: zoom-fade 10s both;
  }
  
  @keyframes zoom-fade {
  
    0% {
      /*transform: scale(1.05);*/
      transform: scale(1);
    }
  
    100% {
      /*transform: scale(1);*/
      transform: scale(1.05);
    }
  
  }

.sec{
    margin:0 auto 100px;
}


.sec .inner{
    width:1200px;
    margin:0 auto;
    padding:0 20px;
}

.sec p{
    margin-bottom:20px;
}

h2.title{
    width:100%;
    font-size:3.6rem;
	font-family:'Noto Serif Japanese', serif !important;
	font-weight:500;
	transform:rotate(0.001deg);
    background:var(--midashi-bg);
    text-align:center;
    color:#ffffff;
    padding:10px 0;
    margin-bottom:30px;
}

#sec01 .sec01-img{
    width:350px;
    float:right;
}


#sec01 p .letter-short{
    letter-spacing: -0.02em;
    display:block;
}

#sec01 .tantoui{
    width:900px;
    margin:0 auto;
    background:var(--gray-bg);
    padding:20px;
    box-sizing: border-box;
}

#sec01 .tantoui p{
    text-align:center;
    margin-bottom:10px;
}

#sec01 .tantoui table{
    width:530px;
    border-collapse: collapse;
    margin:0 auto 20px;
}

#sec01 .tantoui table th, .tantoui table td{
    font-size:2.2rem;
    padding:10px;
    text-align:center;
    vertical-align: middle;
    border:1px solid #d8d8d8;
} 

#sec01 .tantoui table th{
    background:var(--midashi-bg);
    color:#ffffff;
    font-weight:normal;
}

#sec01 .tantoui table td{
    background:#ffffff;
}

#sec01 .tantoui table td.lightblue{
    background:#eceff9;
}

#sec01 .tantoui a{
    text-align:center;
    display:block;
}

#sec02 h2.title + p{
    text-align:center;
}

#sec02 .cause{
    background:var(--gray-bg);
    padding:20px;
    margin-bottom:50px;
}

#sec02 .cause ul{
    width:1100px;
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    flex-wrap: wrap;
}

#sec02 .cause ul li{
    width:48%;
    display:flex;
    justify-content: start;
    align-items: center;
    margin-bottom:20px;
}

#sec02 .cause ul li span{
    width:170px;
    background:#7887a3;
    color:#ffffff;
    text-align:center;
    padding:10px 0;
    margin-right:20px;
}

#sec02 .cause ul li:nth-child(5){
    margin-bottom:0;
}

#sec02 .cause ul li:last-child{
    margin-bottom:0;
}

#sec02 .inspection-method{
    margin-bottom:80px;
}

#sec02 .inspection-method p{
    text-align:center;
}

#sec02 .inspection-method ul{
    width:815px;
    margin:0 auto;

}

#sec02 .inspection-method ul li{
    background:#f3f5e9;
    font-size:2.4rem;
    font-weight:bold;
    margin-bottom:20px;
    padding:5px 0;
    text-align:center;
}

#sec02 .inspection-method ul li.pink{
    background:#ac657e;
    color:#ffffff;
}


.sonosite{
    background:#e6e7ea;
    width: 100%;
    min-width:1240px;
    padding:30px 0;
}

.sonosite .inner{
    position: relative;
}

.sonosite p.pink{
    color:#a51a4b;
    font-weight:bold;
    padding-left:1em;
    text-indent:-1em;   
}

.sonosite p:last-child{
    margin-bottom:0;
}


.sonosite .imgarea{
    position:absolute;
    right:0;
    top:-100px;
}

#sec03{
    padding-top:50px;
}

#sec03 h2.title+p{
    text-align:center;
}

#sec03 .block{
    margin-bottom:50px;
}

#sec03 .block h3.title{
    border-left:5px solid var(--midashi-bg);
    padding:10px;
    font-size:2.4rem;
    margin-bottom:20px;
}

#sec03 .block p .letter-short{
    letter-spacing: -0.01em;
}

#sec03 .block p .yellow-line{
    font-weight:bold;
    background: linear-gradient(rgba(255,255,255,0) 60%, #FFF6B4 60%);    ;
}

#sec03 .block h4.title{
    padding:5px 15px;
    margin-bottom:20px;
    background:#f3f5e9;
    display:inline-block;
}

#sec03 .block .surgery-method{
    background:var(--gray-bg);
    padding:30px;
    display:flex;
    justify-content: space-between;
    text-align:center;
}

#sec03 .block .surgery-method figure{
    width:50%;
}

#sec03 .block .surgery-method figure img{
    margin-bottom:10px;
}

#sec03 .block .surgery-method figcaption{
    font-weight:bold;
}

footer{
   min-width:1240px;
   background:var(--midashi-bg);
   text-align:center;
   color:#ffffff;
   font-size:1.6rem;
   padding:20px 0;
}

footer .inner{
    width:1200px;
    margin:0 auto;
    padding:0 20px;
}


@media screen and (max-width:1240px){
    body{
        overflow-x: visible;
    }

    header{
        width:1200px;
        display:flex;
        justify-content: space-between;
        align-items: center;
        background:#ffffff;
        position: absolute;
        left:0;
        right:0;
        top:32.2px;
        border-radius: 15px;
        margin:0 20px;
        padding:15px 30px;
        box-sizing: border-box;
        z-index: 100;
        box-shadow: 0px 10px 10px -6px rgba(0, 0, 0, 0.3);
    }
    
    
    
    .slider li img{
        width:auto;
        height:517px;
        z-index: -1;
        object-fit: cover;
    }
    
    .catchcopy{
        position: absolute;
        top:226px;
        right:226px;
    }
    
    .catchcopy img{
        width:368px;
    }

}

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

    body{
        font-size:1.4rem;
        font-family:'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','Meiryo','メイリオ','Yu Gothic Medium','游ゴシック Medium', sans-serif;
        line-height:1.8;
        color:#333333;
        overflow-x: hidden;
        overflow-wrap: break-word;
    }    

    header{
        width:100%;
        display:block;
        justify-content: space-between;
        align-items: center;
        background:#ffffff;
        position: relative;
        left:0;
        right:0;
        top:0;
        border-radius: 0px;
        margin:0;
        padding:10px 0;
        box-sizing: border-box;
        z-index: 100;
        box-shadow: inherit;
    }

    header h1{
        width:170px;
        margin:0 auto 10px;
    }
    
    header .home-logo{
        width:240px;
        margin:0 auto;
    }
    
    header .home-logo img{
        width:100%;
    }

    .slider-wrap{
        position: relative;
        margin-bottom:10.9375vw;
        min-width: inherit;
    }
        

    .slider li img{
        width:auto;
        height:117.1875vw;
        z-index: -1;
        object-fit: cover;
    }
    
    .catchcopy{
        position: absolute;
        top:12.5vw;
        right:0px;
        left:0px;
        text-align:center;
    }
    
    .catchcopy img{
        width:70.3125vw;
    }
    


    .sec{
        margin:0 auto 50px;
        display:none;
    }

    .sec.open{
        display:block;
    }
    
    .sec .inner{
        width:90%;
        margin:0 auto;
        padding:0px;
    }
    
    /* .sec p{
        margin-bottom:20px;
    } */
    
    h2.title{
        width:100%;
        font-size:2rem;
        font-family:'Noto Serif Japanese', serif !important;
        font-weight:500;
        transform:rotate(0.001deg);
        background:var(--midashi-bg);
        text-align:center;
        color:#ffffff;
        padding:5px 0;
        margin-bottom:30px;
    }
    
    #sec01 .sec01-img{
        width:100%;
        float:right;
        margin-bottom:20px;
    }
    
    
    #sec01 p .letter-short{
        letter-spacing: 0;
        display:block;
    }
    
    #sec01 .tantoui{
        width:100%;
        margin:0 auto;
        background:var(--gray-bg);
        padding:10px;
        box-sizing: border-box;
    }
    
    #sec01 .tantoui p{
        text-align:left;
    }
    
    #sec01 .tantoui table{
        width:100%;
        border-collapse: collapse;
        margin:0 auto 20px;
    }
    
    #sec01 .tantoui table th, .tantoui table td{
        font-size:1.6rem;
        padding:10px;
        text-align:center;
        vertical-align: middle;
        border:1px solid #d8d8d8;
    } 
    
    /* #sec01 .tantoui table th{
        background:var(--midashi-bg);
        color:#ffffff;
        font-weight:normal;
    } */
    
    /* #sec01 .tantoui table td{
        background:#ffffff;
    } */
    
    /* #sec01 .tantoui table td.lightblue{
        background:#eceff9;
    } */
    
    #sec01 .tantoui a{
        text-align:left;
        display:block;
    }
    
    #sec02 h2.title + p{
        text-align:left;
    }
    
    #sec02 .cause{
        background:var(--gray-bg);
        padding:10px;
        margin-bottom:30px;
    }
    
    #sec02 .cause ul{
        width:100%;
        margin:0 auto;
        display:flex;
        justify-content:space-between;
        flex-wrap: wrap;
    }
    
    #sec02 .cause ul li{
        width:100%;
        display:block;
        justify-content: start;
        align-items: center;
        margin-bottom:20px;
        text-align:center;
    }
    
    #sec02 .cause ul li span{
        width:100%;
        display:block;
        background:#7887a3;
        color:#ffffff;
        text-align:center;
        padding:10px 0;
        margin-right:0px;
    }
    
    #sec02 .cause ul li:nth-child(5){
        margin-bottom:20px;
    }
    
    #sec02 .cause ul li:last-child{
        margin-bottom:0;
    }
    
    #sec02 .inspection-method{
        margin-bottom:0px;
    }
    
    #sec02 .inspection-method p{
        text-align:left;
    }
    
    #sec02 .inspection-method ul{
        width:100%;
        margin:0 auto;
    
    }
    
    #sec02 .inspection-method ul li{
        background:#f3f5e9;
        font-size:1.6rem;
        font-weight:bold;
        margin-bottom:20px;
        padding:5px 0;
        text-align:center;
    }
    
    #sec02 .inspection-method ul li.pink{
        background:#ac657e;
        color:#ffffff;
    }
    
    
    .sonosite{
        background:#e6e7ea;
        width: 100%;
        min-width:inherit;
        padding:30px 0;
    }
    
    /* .sonosite .inner{
        position: relative;
    } */
    
    /* .sonosite p.pink{
        color:#a51a4b;
        font-weight:bold;
        padding-left:1em;
        text-indent:-1em;
    } */

    .sonosite p .indent{
        display:block;
        padding-left:3em;
        text-indent:-2.6em;
    }
    
    .sonosite .imgarea{
        position:relative;
        right:0;
        top:0;
        margin-bottom:20px;
    }

    .sonosite .imgarea img{
        width:100%;
    }
    
    #sec03{
        padding-top:0px;
    }
    
    #sec03 h2.title+p{
        text-align:left;
    }
    
    #sec03 .block{
        margin-bottom:50px;
    }
    
    #sec03 .block h3.title{
        border-left:5px solid var(--midashi-bg);
        padding:10px;
        font-size:2rem;
        margin-bottom:20px;
    }
    
    #sec03 .block p .letter-short{
        letter-spacing: -0.01em;
    }
    
    #sec03 .block p .yellow-line{
        font-weight:bold;
        background: linear-gradient(rgba(255,255,255,0) 60%, #FFF6B4 60%);    ;
    }
    
    #sec03 .block h4.title{
        padding:5px 15px;
        margin-bottom:20px;
        background:#f3f5e9;
        display:inline-block;
    }
    
    #sec03 .block .surgery-method{
        background:var(--gray-bg);
        padding:30px;
        display:flex;
        flex-wrap:wrap;
        justify-content: space-between;
        text-align:center;
    }
    
    #sec03 .block .surgery-method figure{
        width:100%;
        margin-bottom:30px;
    }
    
    #sec03 .block .surgery-method figure:last-child{
        margin-bottom:0;
    }
    
    #sec03 .block .surgery-method figure img{
        margin-bottom:10px;
    }
    
    #sec03 .block .surgery-method figcaption{
        font-weight:bold;
    }
    
    footer{
       min-width:inherit;
       background:var(--midashi-bg);
       text-align:center;
       color:#ffffff;
       font-size:1.6rem;
       padding:20px 0;
    }

    footer .inner{
        width:90%;
        margin:0 auto;
        padding:0px;
    }

    .menu-btn{
        width:90%;
        margin:0 auto 60px;
    }

    .menu-btn div{
        font-size:1.6rem;
        border:1px solid #999999;
        margin-bottom:15px;
        padding:5px 0;
        text-align:center;
    }

    .menu-btn div.active{
        background:#a51a4b;
        color:#ffffff;
    }

    
}