@charset "utf-8";
@import url("../../../common/css/reset.css");
@import url("../../../common/css/common.css");
@import url("../../../common/css/layout.css");

/* article
──────────────────────────────────────────────────────────── */

article{
    margin: 5em 1em 0;
}

@media screen and (min-width:601px) { 

    article{
        margin: 5em 2em 0;
    }
    
}

@media screen and (min-width:961px) { 

    article{
        display: flex;
        flex-wrap: wrap;
        margin: 5em auto 0;
        width: 960px;
        justify-content: space-between;
    }
    
}

@media screen and (min-width:1281px) { 

    article{
        margin: 5em auto 0;
        width: 1280px;
    }
    
}

/* section
──────────────────────────────────────────────────────────── */

@media screen and (min-width:961px) { 

    main section{
        width: calc(50% - 1.5em);
    }
    
}

/* text
──────────────────────────────────────────────────────────── */

article div{
    margin: 2em 0 0;
}

article h2 span{
    font-size: 1rem;
}

article p,
article dl{
    line-height: 1.8;
}

article p{
    margin: 1em 0 0;
}

article dl{
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}

article dl dt{
    border-bottom: 2px #64BF72 dotted;
    box-sizing: border-box;
    padding: 1em;
    width: 6em;
}

article dl dd{
    border-bottom: 2px #64BF72 dotted;
    box-sizing: border-box;
    padding: 1em;
    width: calc(100% - 6em);
    line-break: strict;
}

article img[src*="map"]{
    box-sizing: border-box;
    border: 10px #FFF solid;
    display: block;
    max-width: 100%;
    height: auto;
}

article dl dd ruby{
    font-size: 1.5em;
}

article dl dd ruby rp,
article dl dd ruby rt{
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    color: #eb6d9a;
}

article a{
    color: #333;
}

article .contact a{
    text-decoration: none;
    padding: 0;
    margin: 0;
    line-height: 0;
}

article a[href*="https://"]{
    color: #333;
    text-decoration: none;
    transition: all 0.3s ease 0s;
    
}

article a[href*="https://"]:hover{
    text-decoration: underline;
    opacity:1;
}

article a[href*="https://"]::after{
    background:url("../../../common/img/icon/GRN_target_blank.svg") no-repeat center;
    background-size: 100% auto;
    content: "";
    display: inline-block;
    margin: 0 0 0 0.25em;
    height: 0.8em;
    width: 0.8em;
}

article iframe{
    box-sizing: border-box;
    display: block;
    border:10px #FFF solid !important;
    width: 100%;
}

@media screen and (min-width:961px) { 

    article > div{
        width:calc(50% - 1.5em);
    }
    
    article h2{
        width: 100%;
    }
    
    .title_h2 br{
        display: none;
        visibility: hidden;
    }
    
    article img[src*="map"]{
        border: 10px #FFF solid;
    }
    
}