body {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    line-height: 1.5;
    background-color:paleturquoise;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='52' viewBox='0 0 52 52'%3E%3Cpath fill='%23469354' fill-opacity='0.22' d='M0 17.83V0h17.83a3 3 0 0 1-5.66 2H5.9A5 5 0 0 1 2 5.9v6.27a3 3 0 0 1-2 5.66zm0 18.34a3 3 0 0 1 2 5.66v6.27A5 5 0 0 1 5.9 52h6.27a3 3 0 0 1 5.66 0H0V36.17zM36.17 52a3 3 0 0 1 5.66 0h6.27a5 5 0 0 1 3.9-3.9v-6.27a3 3 0 0 1 0-5.66V52H36.17zM0 31.93v-9.78a5 5 0 0 1 3.8.72l4.43-4.43a3 3 0 1 1 1.42 1.41L5.2 24.28a5 5 0 0 1 0 5.52l4.44 4.43a3 3 0 1 1-1.42 1.42L3.8 31.2a5 5 0 0 1-3.8.72zm52-14.1a3 3 0 0 1 0-5.66V5.9A5 5 0 0 1 48.1 2h-6.27a3 3 0 0 1-5.66-2H52v17.83zm0 14.1a4.97 4.97 0 0 1-1.72-.72l-4.43 4.44a3 3 0 1 1-1.41-1.42l4.43-4.43a5 5 0 0 1 0-5.52l-4.43-4.43a3 3 0 1 1 1.41-1.41l4.43 4.43c.53-.35 1.12-.6 1.72-.72v9.78zM22.15 0h9.78a5 5 0 0 1-.72 3.8l4.44 4.43a3 3 0 1 1-1.42 1.42L29.8 5.2a5 5 0 0 1-5.52 0l-4.43 4.44a3 3 0 1 1-1.41-1.42l4.43-4.43a5 5 0 0 1-.72-3.8zm0 52c.13-.6.37-1.19.72-1.72l-4.43-4.43a3 3 0 1 1 1.41-1.41l4.43 4.43a5 5 0 0 1 5.52 0l4.43-4.43a3 3 0 1 1 1.42 1.41l-4.44 4.43c.36.53.6 1.12.72 1.72h-9.78zm9.75-24a5 5 0 0 1-3.9 3.9v6.27a3 3 0 1 1-2 0V31.9a5 5 0 0 1-3.9-3.9h-6.27a3 3 0 1 1 0-2h6.27a5 5 0 0 1 3.9-3.9v-6.27a3 3 0 1 1 2 0v6.27a5 5 0 0 1 3.9 3.9h6.27a3 3 0 1 1 0 2H31.9z'%3E%3C/path%3E%3C/svg%3E");
/*====================================
 準備中
=====================================*/
    background-image: url(/img/準備中.jpg);opacity: 50%; 
    background-position: 50% 50%,50% 0%;
}

a {
    text-decoration: none;
}

a:hover {
    opacity: 0.7;
}

.container{
    width: auto;
    margin: auto;
    padding: 10px;
}

.clear::after {
    content: "";
    clear: both;
    display: block;
}

/*====================================
header
=====================================*/
header{
    background-color: white;
}

.top-boder{
    background-color: orange;
    height: 5px;
}

.header-title{
    font-weight: bold;
    font-size: 15px;
    font-family:Georgia, 'Times New Roman', Times, serif;
}

.header-left {
    float: left;
}

.header-right{
    float:right;
}



.header-nav-item {
    float: left;
    margin-left: 50px;
}

.header-nav-item a {
    font-size: 130%;
    font-weight: 600;
    line-height: 36px;
   }

/*====================================
top
=====================================*/

.top{ text-align: center;
      font-family:Georgia, 'Times New Roman', Times, serif;
      font-size: 100PX;
}

.top-title{font-size: 20vw;
    max-width: 500px;
    
}


/*====================================
自己紹介
=====================================*/


.jikosyoukai{
    text-align: center;
    width: auto;
    font-size: 50PX;
    padding-bottom: 0;
    display: flex;
    }

.jikosyoukai-title{
    display: inline-block;
}

.jikosyoukai-title img{
    vertical-align: bottom;
    
    }


.jikosyoukai-message{
    margin-left: auto;margin-right: auto;
    padding: 1rem 2rem;
  border: 3px solid #000;width: 50%;max-width: 500px;
    font-size: 20px;
    text-align: center;
}


/*====================================
service
=====================================*/


.service-title{
    text-align: center;
    font-size: 50px;
    width: auto;
}

.service-wrapper {
    display: flex;
    justify-content: space-evenly;
    margin: 10px 50px;
}


.service-item {
    width: 25%;
    background: white;
    vertical-align: text-top;
}

.service-item-detail {
    width: 30%;
    vertical-align: text-top;
}

.service-item img{
    box-shadow: 0px 2px 4px black;
}

.service-subtitle{
    font-size: 2.5vw;
    font-weight: bold;
    text-align: center;
    padding-bottom: 20px;
}


/*====================================
work
=====================================*/


.work-title{
    text-align: center;
    font-size: 50px;
    width: auto;
    
}

.work-wrapper {
    display: flex;
    justify-content: space-evenly;
    margin: 10px 15% 10px 15%;
    text-align: center;
}

.work-item {
    width: auto;
    height: auto;
    padding-bottom: 20px;
}

.work-item img{
    box-shadow: 0px 2px 4px black;
    }

.deitora-setumei{
    width: 90%;
    margin-top: 10px;
}

.bootstrap-setumei{
    width: 90%;
    margin-top: 10px;
}

/*====================================
contact
=====================================*/


.section-title{
    text-align: center;
    padding: 20px;
    font-size: 50px;
   
}

.section-title img{vertical-align:bottom;
}

.contact-mesage {
    text-align: center;
    margin-bottom: 10px;
}

input[type="email"] {
    width: 600px;width: 50%;max-width: 500px;height: 45px;
    border: 3px solid #d8d8d8;
    font-size: 18px;
    display: block;
    margin: auto;
    padding: 15px;
    border-radius: 999px;
    margin-bottom: 20px;
}

::placeholder {
	text-align: center;
}

.btn {
    padding: 20px 60px;
    display: inline-block;
    background-color: #082b48;
    color: #fff;
    font-size: 24px;
    font-weight: bold;
    border-radius: 4px;
    border: none;
    
}

.btn:hover {
    opacity: 0.7;
    cursor: pointer;
}

.btn-register {
    background-color: #ec6d64;
    display: block;
    margin: auto;

}


/*====================================
footer
=====================================*/
footer {
    background-color: #082B4B;
    color: #fff;
    padding: 20px 0;
}

.copy-right {
    font-size: 12px;
    text-align: right;
}