html, body {
    margin:0;
    padding:0;
    font-family:"ヒラギノ角ゴ Pro W3",'メイリオ',"Osaka",Arial,sans-serif;
}
a {
    text-decoration:none;
}
address {
    font-style:initial;
}

header {
    margin:0 auto 0 auto;
    padding:20px 0 20px 0;
    
    justify-content:space-between;
    align-items:center;
}



.heain {
    display:flex;
    align-items:center;
    gap:20px;
}


figure {
    margin:0!important;
}
figure img {
    display:block;
    width:100%;
}

nav {
    background-color:#323232;
    overflow:hidden;
}
.navin {
    margin:0 auto 0 auto;
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    font-weight:bold;
    text-align:center;
}
.navin div {
    padding:20px 0 20px 0;
    color:white;
}

article {
    
    margin:0 auto 0 auto;
    padding:30px 0 0 0;
}
.artin {
    gap:20px;
}
.artmess {
    flex:1;
}
.artimg {
    flex:0.8;
}
.artimg img {
    width:100%;
}
.arttable {

}
.arttable table {
    width:100%;
}
.arttable table, .arttable th, .arttable td {
    border:1px solid black;
    border-collapse:collapse;
    text-align:center;
}
.arttable th {
    font-weight:bold;
    color:gray;
}
.arttable .in1 {
    font-weight:bold;
    color:black;
    padding:40px 0 40px 0;
}
.arttable .in2 {
    color:gray;
}
.arttable .in3 {
    font-weight:bold;
    color:red;
}
.artrem {
    text-align:right;
}
.artplan {
    padding:20px 0 20px 0;
    gap:10px;
}
.artplanin {
    flex:1;
}
.artplanin .cs {
    padding:20px;
    background-color:#EFEFEF;
}
.artplanin .bot {
    padding:10px 20px 10px 20px;
    background-color:#444444;
    font-weight:bold;
    color:white;
}
.artfocus {
    margin:20px 0 20px 0;
    padding:30px;
    background-color:#EFEFEF;
}
.arttit {
    font-weight:bold;
    line-height:40px;
}
.artcase {
    padding:10px 0 10px 0;
}
.artcase .mes {
    flex:1;
    padding:30px;
}
.artcase .mes .mes1 {
    padding:0 0 30px 0;
}
.artcase .pho {
    flex:0.5;
}
.artcase .pho img {
    width:100%;
}
.artqna {
    grid-template-columns:repeat(2, 1fr);
    column-gap:20px;
    row-gap:20px;
}
.artqnain {
    background-color:#EEEEEE;
    padding:30px;
}
.artqnain .pho {
    padding:0 0 20px 0;
}
.artqnain .tbl {
    padding:20px 0 0 0;
}
.artqnain table {
    width:100%;
    background-color:white;
}
.artqnain table, .artqnain th, .artqnain td {
    border:1px solid gray;
    border-collapse:collapse;
    text-align:center;
}
.artqnain th {
    font-weight:bold;
}

.artlogo {
    flex:0.8;
    padding:50px 0 0 0;
    text-align:center;
}
.artadr {
    flex:1;
    font-size:14px;
}
.artadr .itm {
    padding:0 0 10px 0;
    display:flex;
    gap:10px;
}
.artadr .itm .in1 {
    flex:0.3;
}
.artadr .itm .in2 {
    flex:1;
}

.slo img {
    width:100%;
}

.btnenq {
    padding:5px 15px 5px 15px;
    background-color:red;
    color:white;
    font-weight:bold;
}

.messhl {
    color:red;
    font-weight:bold;
}


footer {
    height:80px;
    background-color:#323232;
    font-size:12px;
    color:white;
    text-align:center;
    line-height:80px;
}

@media (min-width:921px) {
    header {
        width:920px;
        display:flex;
    }
    .logo {
        text-align:initial;
    }
    .logo img {
        width:200px;
    }
    .cont img {
        width:200px;
    }
    .enq img {
        width:200px;
    }
    .heain {
        padding:0;
        justify-content:initial;
    }

    .tagpc {
        display:block;
    }
    .tagmb {
        display:none;
    }

    .navin {
        width:920px;
        font-size:18px;
    }
    article {
        width:920px;
    }
    .artin {
        display:flex;
        padding:0;
    }
    .artcase .mes .mes1 img {
        width:initial;
    }
    .artplan {
        display:flex;
    }
    .artplanin .cs {
        height:200px;
    }
    .artqnain .pho img {
        width:initial;
    }
    .arttit {
        padding:0;
    }
    .artcase {
        display:flex;
    }
    .artqna {
        display:grid;
    }
    .artcomp {
        padding:30px 0 50px 0;
        display:flex;
    }
}

@media (max-width:920px) {
    header {
        width:initial;
        display:initial;
    }
    .logo {
        text-align:center;
    }
    .logo img {
        width:80%;
    }
    .cont img {
        width:100%;
    }
    .enq img {
        width:100%;
    }
    .heain {
        padding:20px 0 20px 0;
        justify-content:center;
    }

    .tagpc {
        display:none;
    }
    .tagmb {
        display:block;
    }

    .navin {
        width:initial;
        font-size:14px;
    }
    article {
        width:initial;
    }
    .artin {
        display:block;
        padding:0 20px 0 20px;
    }
    .artcase .mes .mes1 img {
        width:100%;
    }
    .artplan {
        display:block;
    }
    .artplanin .cs {
        height:initial;
    }
    .artqnain .pho img {
        width:300px;
    }
    .arttit {
        padding:0 20px 0 20px;
    }
    .artcase {
        display:block;
    }
    .artqna {
        display:block;
    }
    .artcomp {
        padding:0 20px 50px 20px;
        display:block;
    }
}