@charset "utf-8";
/* CSS Document */

@media screen and (min-width:1024px){
    body{
        background-color: #f8f4e6!important;
    }

    .article{
        display: block;
        margin: 5% 15%;
    }
    

    .title{
        text-align: center;
        margin: 10% 0 15%;
        font-family: "vdl-v7mincho", sans-serif;
        font-weight: 300;
        font-style: normal;
        font-size: 35px;
        z-index: 1;
    }

    .title::before{
        content:url(https://hakumonsai.weblike.jp/2023/test/akari/organization/img/webtitle_branch_cream_wide.png);
        display: block;
        margin-top: 3rem;
        position: absolute;
        left: 50%;
        transform: translate(-50%, -50%) scale(0.78);
        z-index: -1; 
    }

    .text{
        font-family: "ryo-gothic-plusn", sans-serif;
        font-weight: 300;
        font-style: normal;
        font-size: 17px;
        letter-spacing: 0.1em;
        z-index: 1;
    }

    .subtitle_1,
    .subtitle_2,
    .subtitle_3,
    .subtitle_4{
        margin: 8% 0 34px;
        font-family: "vdl-v7mincho", sans-serif;
        font-weight: 300;
        font-style: normal;
        font-size: 25px;
        text-decoration: underline 2.4px;
        text-decoration-color: #a61c4b;
        text-underline-offset: 11px;
        position: relative;
        z-index: 1;
    }

    .subtitle_1::before {
        content: url(http://hakumonsai.weblike.jp/2023/test/akari/gallery/img/midashi_matsu.png);
        display: block;
        position: absolute;
        transform: translate(-48.3%, -47.8%) scale(0.03);
        z-index: -1;
    }

    .subtitle_2::before {
        content: url(http://hakumonsai.weblike.jp/2023/test/akari/overview/img/midashi_take.png);
        display: block;
        position: absolute;
        transform: translate(-48.3%, -48.2%) scale(0.025);
        z-index: -1;
    }

    .subtitle_3::before {
        content: url(http://hakumonsai.weblike.jp/2023/test/akari/overview/img/midashi_ume.png);
        display: block;
        position: absolute;
        transform: translate(-48.3%, -48.65%) scale(0.025);
        z-index: -1;
    }

    .subtitle_4::before {
        content: url(http://hakumonsai.weblike.jp/2023/test/akari/organization/img/midashi_tori.png);
        display: block;
        position: absolute;
        transform: translate(-48.3%, -48.5%) scale(0.025);
        z-index: -1;
    }

    .komidashi {
        display: inline-block;
        margin: 5% 0 20px;
        padding-bottom: 1.5px;
        font-family: "vdl-v7mincho", sans-serif;
        font-weight: 300;
        font-style: normal;
        font-size: 20px;
        border-bottom: #cbb24f dotted 3px;
        
    }

    .fsr{
        text-align: center;
    }

    .fsrlogo{
        margin-top: 3%;
        width: 40%;
    }

    .SNS{
        display: flex;
        justify-content: center;
    }

    .x{
        margin-left: 5rem;
    }


    .btn,
    a.btn,
    button.btn {
        position: relative;
        display: inline-block;
        margin-top: 23px;
        padding: 1rem 4rem;
        font-size: 1.6rem;
        font-weight: 300;
        line-height: 1.5;
        letter-spacing: 0.1rem;
        cursor: pointer;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-transition: all 0.3s;
        transition: all 0.3s;
        text-align: center;
        vertical-align: middle;
        text-decoration: none;
        color: #a61c4b;
        border-radius: 0.5rem;
    }

    a.btn-border-shadow {
        padding: calc(1.5rem - 12px) 3rem 1.5rem;
        background: #cbb24f;
        border-radius: 100vh;
    }

    a.btn-border-shadow:before {
        position: absolute;
        top: -6px;
        left: -6px;      
        width: 100%;
        height: 100%;      
        content: "";
        -webkit-transition: all 0.3s ease;
        transition: all 0.3s ease;      
        border: 2.4px solid #a61c4b;
        border-radius: 0.5rem;
    }
      
    a.btn-border-shadow--radius:before {
        border-radius: 100vh;
    }
      
    a.btn-border-shadow:hover {
        padding: calc(1.5rem - 6px) 3rem;
        color: #a61c4b;
    }
      
    a.btn-border-shadow:hover:before {
        top: 0;
        left: 0;
    }
    
    .gotomenu{
        margin: 10% auto 0;
        width: 100px;
        font-size: 17px;
        font-family: "ryo-gothic-plusn", sans-serif;
        font-weight: 300;
        font-style: normal;
        
      }  
  
      a.gotomenu-border {
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 80px;
        height: 80px;
        text-align: center;
        text-decoration: none;
        color: #a61c4b;
        background: #cbb24f;
        text-decoration: none;
      }
      
      a.gotomenu-border:hover {
        color: #cbb24f;
        background: #a61c4b;
        text-decoration: none;
      }
}