@charset "UTF-8";
@font-face{
    font-family: 'MainFont';
    src: url(../fonts/HuiFont29.ttf);
}
@font-face{
    font-family: 'tsukushi';
    src: url(../fonts/TsukuARdGothic-Regular.otf);
}
@font-face{
    font-family: 'fude';
    src: url(../fonts/aoyagireisyosimo_ttf_2_01.ttf);
}
@font-face{
    font-family: 'tsukushi-bold';
    src: url(../fonts/TsukuARdGothic-Bold.otf);
}
@font-face{
    font-family: 'artisan';
    src: url(../fonts/The_Artisan_Marker.otf);
}
@font-face {
    font-family: 'chalk';
    src: url(../ShigotoMemogaki-Regular-1-02.ttf);
}

html{
    font-size: 62.5%;
}

body{
    margin: 0;
    background-color: #f8f4e6;
    font-family: tsukushi;
    font-size: 1.5rem;
    padding: 0;
}

*{
    /*border: 1px solid red;*/
}

@media screen and (min-width: 835px){
.toptitle{
    background: rgb(10,50,10);
    background-size: cover;
    overflow: hidden;
    box-sizing: border-box;
    margin: 0;
    width: 100%;
    height: 7rem;
}

.top1{
    font-family: artisan;
    font-size: 3rem;
    color: rgb(255,130,130);
    float: left;
    box-sizing: border-box;
    height: 100%;
    width: 33%;
    margin: 0 0 0 0;
    position: relative;
}
.top1 img{
    height: 100%;
}
.top2{
    font-family: MainFont;
    font-size: 5rem;
    color: white;
    text-align: center;
    letter-spacing: 2rem;
    float: left;
    box-sizing: border-box;
    width: 33%;
    height: 100%;
    position: relative;
    margin: 1rem 0 0 0;
    
}
.top3{
    font-family: chalk;
    float: left;
    box-sizing: border-box;
    width: 20%;
    height: 100%;
    margin: 0 auto;
    position: relative;
    margin: 1.5rem 0 0 0;
}
.toptm{
    text-align: center;
}
.toptm a{
    color: black;
    text-decoration: none;
}
.toptm a:hover{
    color: #6f4b3e;
    text-decoration: none;
}

#telmail{
    text-align: center;
    font-family: tsukushi-bold;
    font-size: 2rem;
    line-height: 1.2;
}
nav{
    background-color: rgb(10,50,10);
}
nav li a.now{
    background-color: rgb(80,100,80);
}
nav ul{
    overflow: hidden;
    list-style: none;
    margin: 0 auto 15px auto;
    padding: 0;
}
nav li{
    box-sizing: border-box;
    float: left;
    border-left: 2px solid white;
    border-top: 2px solid white;
    border-bottom: 2px solid white;
    width: 20%;
}
nav li:last-child{
    border-right: 2px solid white;
}
nav li a:hover{
    background: orange;
}
nav li a.current{
    background: orange;
}
nav li a{
    display: block;
    padding: 0.6rem 0;
    width: 100%;
    text-decoration: none;
    text-align: center;
    font-family: MainFont;
    font-size: 25px;
    color: white;
}

p{
    font-size: 1.5rem;
    text-align: center;
    margin: 0;
    line-height: 1.8;
}
.punchline{
    text-align: center;
    font-size: 2rem;
    font-family: tsukushi-bold;
    text-indent: 5px;
}
.strong{
    font-family: tsukushi-bold;
}

.type{
    list-style: none;
    overflow: hidden;
    margin: 0;
    padding: 0;
}
.type li{
    width: max-content;
    float: left;
}
.type_inner img{
    width: 150px;
    height: 150px;
    border: 3px solid rgb(10,50,10);
    border-radius: 20px;
}
.discription{
    font-family: MainFont;
    font-size: 25px;
    color: white;
    background-color: rgb(10,50,10);
    position: absolute;
    bottom: 25px;
    left: 0;
    padding: 0 10px;
}
#type_1{
    width: 70%;
    margin: 0 auto;
    overflow: hidden;
}
#type_2{
    width: 53%;
    overflow: hidden;
    margin: 0 auto;
}
#type_1 li{
    width: 25%;
}
#type_2 li{
    width: 33.33%;
}
.type_inner{
    width: max-content;
    margin: 40px auto 0 auto;
    position: relative;
}
.type_inner:hover{
    margin: 20px auto 0 auto;
}
.type_inner:hover img{
    height: 170px;
    width: 170px;
}
.type_inner:hover .discription{
    font-size: 30px;
}

#newsframe{
    width: 60%;
    margin: 0 auto;
}
#newshead{
    font-family: MainFont;
    font-size: 20px;
    margin: 40px 0 0 0;
    width: max-content;
    border-radius: 15px;
    padding: 5px 10px;
    background-color: rgb(10,50,10);
}
#newshead a{
    color: white;
    text-decoration: none;
}
#news{
    margin: 10px 0;
    list-style: none;
    padding: 0;
}

#cap{
    overflow: hidden;
    width: 65%;
    margin: 60px auto 0 auto;
}
#cap_in1{
    float: left;
    width: 25%;
    overflow: hidden;
}
#cap_in1 img{
    width: 100%;
    border-radius: 50%;
}
#cap_in2{
    float: left;
    width: 75%;
}
#capname{
    font-family: tsukushi;
    font-size: 15px;
    line-height: 1.0;
    margin: 0 0 0 40px;
    padding: 0;
    border-bottom: 1.5px solid black;
}
#cap_in2 p{
    margin: 7px 0 0 40px;
    line-height: 1.4;
    text-align: left;
}

.worktype_box{
    border-bottom:3px solid rgb(10,50,10);
    margin: 20px 150px 10px 150px;
}
.worktype{
    font-family: MainFont;
    font-size: 20px;
    margin: 0;
    background-color: rgb(10,50,10);
    color: white;
    padding: 5px 10px 5px 10px;
    width: max-content;
}
.sentence{
    margin: 0 150px;
    text-align: left;
    line-height: 1.6;
}
.sentence_bold{
    font-family: tsukushi-bold;
}
.myForm{
     margin: 0 150px;
}
.myForm form{
    margin: 0 0 0 0;
    vertical-align: top;
}
.brf{
    overflow: hidden;
    margin: 50px 0 5px 0;
    padding: 0;
    font-family: MainFont;
    text-decoration: none;
    box-sizing: border-box;
    text-align: center;
}
}

footer{}
.footer-container{
    overflow:hidden;
    padding: 15px;
    background: rgb(10,50,10)
}
.copyright{
    float: left;
    margin: 0;
    font-size: 1rem;
    color: white;
}
footer address{
    float: right;
    font-style: normal;
    font-size: 1rem;
    color: white;
}