@charset "UTF-8";

html {
  font-size: 100%;
}
* {
  margin:0;
  padding: 0
}
body {
  font-family: "游明朝体",serif;
  color: #4b4747;
}
header {
    
    padding-top: clamp(16px,4vw,100px);
}
h1 {
    font-size: clamp(4px,2vw,24px);
    margin-left: clamp(10px,4vw,30px);
    width: clamp(100px,50vw,500px);
}
.aikon {
   
    list-style: none;
    display: flex;
    padding-top: 8px;
    box-sizing: border-box;
    gap: 20px;
   height:  clamp(10px,2vw,20px);
     margin-right: clamp(10px,4vw,30px);
    
}
.aikon li {
    height:  clamp(10px,2vw,20px);
}
.top {
    
    display: flex;
   position: fixed;
   top: 10px;
   width: 100%;
    justify-content:space-between
    
    
}
.nav {
    background-color: aquamarine;
    display: flex;
    justify-content: right;
    gap: 30px;
    list-style: none;
    width: 100%;
    box-sizing: border-box;
    padding-right: clamp(10px,4vw,30px);
    padding-top: clamp(30px,10vh,110px);
   

}
.nav a{
    background-color: blueviolet;
    font-size: 16px;
    text-decoration: none;
   
   
}


h2 {
    font-size: clamp(18px,4vw,50px);
    font-weight: 400;
    font-style: italic;
   
    text-align: center;
    padding-top: 20vh;
    padding-bottom: 20vh;
    width: 100%
}
.pulofu {
    display: flex;
    width: 50%;
    margin: auto;
    justify-content: space-between;
    margin-bottom: 25px;
     font-style: italic;
}
.name {
    font-size: clamp(10px,4vw,36px);
    font-weight: 600;
    
}
.tanjyoubi {
    font-size: clamp(6px,3vw,24px);
    padding-top: 13px;

}
.taipu {
     font-size: clamp(4px,3vw,21px);
     width: 70%;
     margin: auto;
     text-align: center;
      font-style: italic;
      margin-bottom: 50px;
      font-weight: 500;
}
.pulofubun {
    font-size: clamp(4px,3vw,20px);
    width: 50%;
     margin: auto;
     text-align: center;
     line-height: 2.5;
     letter-spacing: 0.05em;
     margin-bottom: 50px;
}
.konseputo {
    font-size: clamp(5px,3vw,21px);
    width: 50%;
     margin: auto;
     text-align: center;
     line-height: 2.5;
     letter-spacing: 0.05em;
}
.seisaku {
    display: flex;
    flex-wrap: wrap;
    width: 1075px;
    margin: auto;
    gap: 25px;
    margin-bottom: 200px;
}
.flow {
    background-color: antiquewhite;
    
}
.flow ol {
    list-style: decimal-leading-zero;
    list-style-position: inside;
   
}


.flow h3 {
    padding-top: 50px;
    font-size: 24px;
   
}
.flow p {
    width: 300px;
    font-size: 16px;
    padding-top: 90px;
   
}
.flowue {
    display: flex;
    justify-content: space-between;
    width: 1075px;
    margin: auto;
    text-align: center;
    gap: 25px;
}
.flowshita {
    display: flex;
    justify-content: space-between;
    width: 700px;
    margin: auto;
    text-align: center;
    padding-top: 200px;
}
.plan {
    width: 1060px;
    margin: auto;
    background-color: blue;
    
}
.koumoku {
    display: flex;
    height: 310px;
    background-color: beige;
    list-style: none;
   height: 350px;
   padding: 20px;
   justify-content: space-between;
  

}
.plan li {
    list-style: none;
}
.Printdesign {
    background-color: aqua;
    width: 330px;
    border: solid 1px gray;

}
.Webdesign {
    background-color: blueviolet;
    width: 330px;
     border: solid 1px gray;
}
.Management {
    background-color: brown;
    width: 330px;
     border: solid 1px gray;
}
.koumoku h3 {
    font-size: 36px;
    padding: 20px;
    font-weight: 600;
}
.naiyou {
    font-size: 18px;
    padding: 20px;
    background-color: bisque;
    line-height: 3;
}
.hosoku {
    margin-left: 1000px;
}
.blog {
    display: flex;
    flex-wrap: wrap;
    width: 1075px;
    margin: auto;
    gap: 25px;
    text-align: center;
    
    }

.bloghidari {
  
    width: 40%;
    height: 600px;

}
.bloghidari img {
    width: 340px;
}
.blogmigi {
   
    width: 50%;
    padding-top: 30px;
    text-align: left;
}

.hiduke {
    padding: 20px;
    font-weight: 600;
    padding-left: 20px;
}
.blog01 a {
    text-decoration: none;
    color: #4b4747;
    }

@media (max-width:768px){
    .blog {
        width: 100%;
       display: block;
       
         margin: auto;
   
    }
    .bloghidari {
    width: 100%;
   
    height: 250px;

}
    .bloghidari img {
    width: 60vw;
  
  
   
}
.blogmigi {
    width: 100%;
   margin: auto;
   padding: 25px;
    font-size: 14px;
    margin-bottom: 100px;
    margin-top: 10px;
   
  
}
.hiduke {
   
    font-weight: 600;
   
    padding-left: 0;
    
    
}
}

.cta {
    text-align: center;
    margin-bottom: 200px;
}
.modoru {
    position: fixed;
    bottom: 20px;
    left: 20px;
}
.modoru a {
    font-size: 18px;
    text-decoration: none;
    color: #4b4747;
   
}
.modoru img {
    vertical-align:-12px;
}
footer small {
    display: block;
    padding-top: 30px;
    text-align: right;
}