@charset "utf-8";
img{
    max-width: 100%;
    height: auto;
}

body#sell .main_img{
    background-image: url(/grantact/img/sell/sell_main.jpg);
    background-position: center top;
}

section.sec_overview{
    background: linear-gradient(#221222, #795A84);
    color: #fff;
}
section.sec_overview > .contents{
    position: relative;
    z-index: 2;
}

.sec_overview .search{
    background: linear-gradient(#bba776, #c4a148);
    color: #000;
    margin-bottom: 5rem;
}
.search .flex{
    min-height: 60px;
    align-items: center;
    flex-wrap: wrap;
}
.search .flex > *{
    width: 50%;
}
.search .flex .right{
    display: flex;
    align-items: center;
}
.search .flex .left p{
    font-size: 17px;
    text-align: center;
    padding: 0 2rem 0 0;
}
.search .flex .right .input{
    min-width: 250px;
    width: 75%;
}
.search .flex .right .button{
    flex: 1;
}
.search .flex .right input[type="text"]{
    width: 100%;
    outline: none;
    border: none;
    height: 32px;
    border-radius: 3px;
    padding: 1rem;
    font-size: 1.2rem;
    box-shadow: 0 3px 6px rgba(0,0,0,0.2);
}
.search .flex .right .btn{
    min-width: unset;
    width: 100px;
    height: 32px;
    outline: none;
    border: none;
    font-size: 1.2rem;
    padding: 0.8rem 1rem;
    font-weight: 400;
    letter-spacing: 0;
    cursor: pointer;
    border-radius: 3px;
    box-shadow: 0 3px 6px rgba(0,0,0,0.2);
}
.search .flex .right .btn .icon.exlink:before{
    content: "";
    display: inline-block;
    width: 12px;
    height: 12px;
    background: url(/grantact/img/common/icon_exlink_white.svg) center / contain no-repeat;
    margin-left: 0.5rem;
    vertical-align: 0px;
}
.sec_service h3,
.sec_overview h3,
.sec_rent h3{
    font-size: 4.2rem;
    font-weight: 300;
    margin: 0 0 5rem;
}
.sec_service .ex,
.sec_overview .ex,
.sec_rent .ex{
    font-size: 1.7rem;
    margin-bottom: 10rem;
}
.sec_overview > .contents > .pamphlet,
.sec_overview > .contents > .feature,
.sec_overview > .contents > .service{
    margin-top: 10rem;
}
.sec_overview h4,
.sec_rent h4{
    border-left: 3px solid #ded4bd;
    font-size: 3.2rem;
    margin-bottom: 4rem;
    line-height: 1.5;
    font-weight: 600;
    padding-left: 2rem;
}
.sec_rent h4{
    border-left: 3px solid #B5B6B6;
}
.sec_overview h4 p,
.sec_rent h4 p{
    font-size: 1.6rem;
    font-weight: 300;
    margin-top: 1rem;
}
.sec_overview .featureList{
    flex-wrap: wrap;
    gap: 3rem 1.5rem;
}
.sec_overview .featureList > li{
    width: calc( (100% - 4.5rem) / 4 );
}
.sec_overview .featureList > li img{
    width: 100%;
    height: 16rem;  
    object-fit: cover;
    object-position: center;
}
.sec_overview .featureList > li h5{
    padding: 1rem;
    letter-spacing: .85em;
    color: #dbdbdb;
    border-bottom: 1px solid #707070;
    font-size: 1.4rem;
    font-weight:300;
}
body.EN .sec_overview .featureList > li h5{
    letter-spacing: 0.2em;
}
.sec_overview .featureList > li h6{
    padding: 1rem 0 2rem;
    font-size: 1.8rem;
}
.sec_overview .featureList > li p{
    font-size: 1.4rem;
    min-height: 11rem;
}
.sec_overview .featureList > li a{
    display: block;
    padding: .5rem 0 .5rem 1.75rem;
    font-size: 1.4rem;
    background: url(/grantact/img/common/icon_link.svg) left center / auto 1rem no-repeat;
    color: #b7a7b8;
}
.sec_overview .featureList > li a.pdf{
    background: url(/grantact/img/common/icon_pdf.svg) left center / auto 1.5rem no-repeat;
}
.sec_overview .serviceList{
    flex-wrap: wrap;
    gap: 2rem;
}
.sec_overview .serviceList > li{
    width: calc( (100% - 6rem) / 4 );
}
.sec_overview .serviceList > li a{
    display: block;
    background: #6c4b6d;
    box-shadow: 0px 3px 6px rgba(0,0,0,0.15);
}
.sec_overview .serviceList > li .img img{
    aspect-ratio: 1.41666;
    object-fit: cover;
}
.sec_overview .serviceList > li .ttl{
    position: relative;
    padding: .5rem 3rem .5rem  0.5rem;
    min-height: 5.5rem;
    background: url(/grantact/img/common/icon_link_white.svg) right 1rem center / auto 1rem no-repeat;
}
.sec_overview .serviceList > li .ttl p{
    position: absolute;
    left: .5rem;
    right: 3rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.6rem;
    line-height: 1.25;
}
.sec_overview .serviceList > li .txt{
    padding: 1.5rem 0;
    font-size: 1.4rem;
}
.linkBlc{
    margin: 7.5rem 0 0;
}
.linkBlc .flex {
    justify-content: flex-end;
    gap: 2rem;
    flex-wrap: wrap;
}
.linkBlc .flex .btn_secondary {
    text-align: left;
    padding: 2rem 0 2rem 2rem;
    width: 34rem;
    margin: 0;
    background: #402944 url(/grantact/img/common/icon_link_white.svg) right 2em center / auto 1.2rem no-repeat;
    font-size: 16px;
}
.sec_overview .pamphletImg{
    flex-wrap: wrap;
    gap: 0.5rem;
}
.sec_overview .pamphletImg > li:first-child{
    width: 56.725%;
}
.sec_overview .pamphletImg > li:last-child{
    width: calc( 43.275% - 0.5rem);
}
.sec_service .service_blc h4{
    font-size: 2.7rem;
    margin-bottom: 3rem;
}
.sec_service .serviceList{
    flex-wrap: wrap;
    gap: 4rem 2rem;
}
.sec_service .serviceList > li{
    width: calc((100% - 4rem) / 3);
}
.sec_service .serviceList > li a{
    display: block;
}
.sec_service .serviceList h5{
    font-size: 2.1rem;
    font-weight: 600;
    padding: .75rem 0;
    color: #6c4b6d;
    background: url(/grantact/img/common/icon_exlink_color.svg) right center / auto 1.3rem no-repeat;
}
.sec_service .serviceList .link h5{
    background: url(/grantact/img/common/arrow_link.svg) right center / auto 1.3rem no-repeat;
}
.sec_service .serviceList p{
    margin-top: 1rem;
    font-size: 1.7rem;
}

.breadcrumb{
    background: #fff;
    border-bottom: 1px solid #dbdbdb;
}

@media screen and (max-width: 1366px){
    .sec_rent h4{
        margin-bottom: 8rem;
    }
    .sec_overview .featureList > li{
        width: calc( (100% - 1.5em) / 2 );
    }
    .sec_overview .featureList > li img{
        width: 100%;
        height: 19rem;
        object-fit: cover;
        object-position: center;
    }
    .sec_overview .serviceList > li{
        width: calc((100% - 4rem) / 3);
    }
    .sec_overview .serviceList > li .ttl p{
        font-size: 1.4rem;
    }
    .sec_service .serviceList > li{
        width: calc((100% - 2rem) / 2);
    }
    .sec_rent .achievements {
        margin-bottom: 10rem;
    }
    .sec_rent .contents .sub_title {
        font-size: 1.6rem;
    }
}

@media screen and (max-width: 820px){
    body#sell .main_img{
        background-image: url(/grantact/img/sell/sell_main_sp.jpg);
        background-position: center;
    }
    .contents{
        width: 100%;
    }
    .contents .contents{
        width: calc( 100% - 60px);
    }
    section.bg{
        padding: 4rem 0;
    }
    section.sec_service > .contents,
    section.sec_rent > .contents,
    section.sec_service,
    section.sec_rent{
        padding: 4rem 0 0;
    }
    .search{
        padding: 1rem;
    }
    .search .flex > *{
        width: 100%;
    }
    .search .flex .left{
    }
    .search .flex .right{
        width: 100%;
        justify-content: center;
    }
    .search .flex .right .input{
        width: auto;
        min-width: unset;
        flex: 1;
        padding: 1rem;
    }
    .search .flex .right .button{
        flex: unset;
        width: calc( 10rem + 2em);
    }
    .sec_overview h3{
        font-size: 4.7rem;
        line-height:1.425;
    }
    .sec_service h3,
    .sec_rent h3{
        font-size: 2.8rem;
    }
    .sec_service .ex,
    .sec_rent .ex,
    .sec_overview .ex{
        font-size: 1.6rem;
        margin-bottom: 3rem;
    }
    .sec_service h3,
    .sec_service .ex,
    .sec_rent  h3,
    .sec_rent  .ex,
    .sec_overview h3,
    .sec_overview .ex{
        width: calc( 100% - 30px);
        margin: 0 auto 5rem;
    }
    .sec_rent > .contents > h3,
    .sec_rent > .contents > .ex{
        width: calc( 100% - 60px);
    }
    .sec_service h3,
    .sec_rent h3{
        margin: 0 auto 4rem;
    }
    .sec_service .ex,
    .sec_rent .ex,
    .sec_overview .ex{
        line-height: 1.875;
        margin: 0 auto 3rem;
    }
    .sec_service .ex,
    .sec_rent .ex{
        line-height: 1.625;
    }
    .sec_service .ex,
    .sec_rent .ex{
        margin: 0 auto 7rem;
    }
    .sec_rent .ex{
        width: 100%;
        font-size: 1.6rem;
    }
    .sec_rent .contents .ex.fw_l{
        margin: 0 auto 1rem;
    }
    .sec_rent .achievements {
        margin-bottom: -4rem;
    }
    .sec_overview .pamphlet .ex{
        width: 100%;
        margin-bottom: 5rem;
    }
    .sec_overview .featureList > li{
        width: 100%;
        margin-top: 4rem;
    }
    .sec_overview .featureList > li img{
        height: 10rem;
    }
    .sec_overview .featureList > li p{
        min-height: 8rem;
    }
    .sec_overview > .contents .service {
        padding-top: 0;
        margin-top: 1rem;
    }
    .sec_overview .serviceList > li{
        width: 100%;
    }
    .sec_overview .serviceList > li a{
        display: flex;
    }
    .sec_overview .serviceList > li a > .img{
        width: 15.8rem;
    }
    .sec_overview .serviceList > li a > .ttl{
        flex: 1;
    }
    .sec_overview .serviceList > li .ttl p{
        left: 2rem;
        width: 9.2rem;
        font-size: 1.6rem;
        line-height: 1.5;
        letter-spacing: .05em;
    }
    .linkBlc{
        margin: 3rem -30px 0 0;
    }
    .contents > .linkBlc{
        margin: 2rem 0 0;
    }
    .linkBlc .flex .btn_secondary{
        border-right: none;
        width: calc(100vw - 30px);
        font-size: 1.8rem;
        letter-spacing: 0;
        padding: 1.775rem 4rem 1.775rem 2rem;
    }
    .sec_overview .pamphletImg > li:first-child,
    .sec_overview .pamphletImg > li:last-child{
        width: 100%;
    }
    .sec_service .service_blc h4{
        font-size: 2rem;
        margin-bottom: 4rem;
    }
    .sec_service .serviceList > li{
        width: 100%;
    }
    .sec_service .serviceList h5{
        font-size: 1.8rem;
        padding: 1.5rem 0;
    }
    .sec_service .serviceList p{
        font-size: 1.4rem;
        margin: 0;
        line-height: 1.7;
    }
    .sec_overview > .contents > .pamphlet{
        margin-top: 4rem;
    }
    .sec_overview > .contents > .feature{
        margin-top: 3rem;
    }
    .sec_overview > .contents > .service{
        margin-top: 2rem;
    }
    .sec_overview h4{
        font-size: 2.8rem;
        letter-spacing: .1em;
        padding-left: 1.5rem;
        margin-bottom: 1rem;
    }
    .sec_overview .pamphlet h4,
    .sec_overview .service h4{
        margin-bottom: 5rem;
    }
    body.EN .sec_overview h4{
        letter-spacing: 0;
    }
    .sec_overview h4 p{
        font-size: 1.2rem;
        letter-spacing: 0;
    }
    .sec_overview .featureList{
        gap: 2rem 0;
    }
    .sec_overview .featureList > li h6{
        font-size: 1.5rem;
        line-height: 1.5;
    }
    .sec_overview .featureList > li p{
        font-size: 1.3rem;
        line-height: 1.72;
        font-weight: 400 !important;
    }
    .sec_overview .featureList > li h5{
        padding: 1.5rem 0;
    }
    .sec_overview .serviceList{
        gap: 4rem;
    }
    .sec_overview .serviceList > li .txt{
        padding: 1rem 0 0;
    }

}
@media screen and (max-width: 360px){
    .sec_overview .serviceList > li .ttl p{
        left: 1rem;
    }
}

.sec_rent{
    background-color: #f7f7f7;
}
.sec_rent.bg::after{
    display: none;
}
.sec_rent .ex{
    line-height: 1.8;
    font-weight: 300;
}
.sec_rent .main_img{
    margin-bottom: 10rem;
}
.sec_rent .sub_title h5{
    font-size: 2rem;
    margin-bottom: 3rem;
}
.sec_rent .sub_title p{
    font-size: 1.4rem;
}
.sec_rent .element,
.sec_rent .link{
    margin: 6rem 0;
}
.strengths{
    background-color: #cccccc57;
    font-size: 2.4rem;
    margin: 4rem 0 6rem 0;
    padding: 1rem 1rem 1rem 3rem;
    align-items: center;
    display: flex;
    justify-content: space-between;
}
.strengths > span{
    color: #928f8f;
    display: inline-block;
    min-width: 25rem;
}
.strengths_img{
    position: relative;
}
.strengths_img > div{
    border: solid 1px #6c4b6d;
    display: flex;
    flex-direction: column;
}
.strengths_img > div:nth-of-type(1){
    margin-right: 7rem;
}
.strengths_img > div:nth-of-type(1)::before,
.strengths_img > div:nth-of-type(1)::after{
    content: "";
    display: block;
    border: solid 1px #6c4b6d;
    transform: rotate(-45deg);
    position: absolute;
    width: 5rem;
    top: 49%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
}
.strengths_img > div:nth-of-type(1)::after{
    transform: translate(-50%, -50%) rotate(45deg);
}
.strengths_img p{
    background-color: #fff;
    color: #6c4b6d;
    font-size: 2rem;
    text-align: center;
    padding: 2rem;
}
.sec_rent a.btn{
    display: block;
    color: #6c4b6d;
    letter-spacing: 1px;
    width: 80%;
    max-width: 55rem;
    margin: 5rem 0 0 auto;
    border: solid 1px #6c4b6d;
    background: url(/grantact/img/common/icon_exlink_color.svg) right 1.2rem center / auto 1.6rem no-repeat;
}
.plan_list{
    flex-wrap: wrap;
    gap: 2rem;
    margin: 6rem 0;
}
.plan_list li{
    font-size: 1.2rem;
    background: #fff url(/grantact/img/common/icon_exlink_color.svg) right 1.2rem center / auto 1.6rem no-repeat;
    border: solid 1px #6c4b6d;
    width: calc(50% - 1rem);
    text-align: center;
}
.plan_list li a{
    border-top: solid 5px #6c4b6d;
    cursor: pointer;
    display: block;
    font-size: 1.4rem;
    color: #928f8f;
    padding: 1rem 2rem 2rem 2rem;
}
.plan_list li:nth-of-type(2) a{
    border-top: solid 5px green;
}
.plan_list li:nth-of-type(3) a{
    border-top: solid 5px #920e0e;
}
.plan_list li:nth-of-type(4) a{
    border-top: solid 5px #21bfff;
}
.plan_list a span{
    display: block;
    font-size: 1.8rem;
    color: #6c4b6d;
    margin-top: 1rem;
}

@media screen and (max-width: 1366px){
    .strengths{
        display: block;
    }
    .strengths_img > div{
        border-width: .2rem;
        justify-content: center;
        width: 100%;
    }
    .strengths > span{
        text-align: center;
        width: 100%;
        display: block;
        padding: 2rem 0 3rem;
        font-weight: 600;
        font-size: 2.4rem;
    }
    .strengths_img p{
        font-size: 1.4rem;
        padding: 1.35rem 0;
    }
}
@media screen and (max-width: 820px){
    .sec_rent h4{
        font-size: 2.8rem;
    }
    .sec_rent h4 p{
        font-size: 1.2rem;
    }
    .strengths{
        padding: 2rem 1rem;
        font-size: 2rem;
    }
    .strengths_img,
    .strengths{
        display: block;
    }
    .strengths_img > div:nth-of-type(1){
        margin: 0 0 7rem;
    }
    .strengths_img > div:nth-of-type(1)::before, .strengths_img > div:nth-of-type(1)::after{
        border-width: .15rem;
        top: 50%;
    }
    .sec_rent a.btn{
        background: #f7f7f7 url(/grantact/img/common/icon_exlink_color.svg) right 1.6em center / auto 1.4rem no-repeat;
        width: calc(100vw - 30px);
        max-width: unset;
        padding: 0.5rem 6rem 0.5rem 1.75rem;
        border: 0.125rem solid #6c4b6d;
        border-right: none;
        height: 64px;
        display: flex;
        font-size: 1.8rem;
        align-items: center;
    }
    .plan_list li{
        width: 100%;
        background: #fff url(/grantact/img/common/icon_exlink_color.svg) right 1.9rem bottom 3.2rem / auto 1.6rem no-repeat;
    }
    .plan_list li a{
        padding: 2.6rem 3rem;
    }
    .plan_list a span{
        font-size: 2.2rem;
    }
    .achievements .img img{
        height: auto;
    }
    .sec_rent .sub_title h5{
        font-size: 1.6rem;
        letter-spacing: 0.1rem;
    }
}